@altinn/altinn-components 0.36.1 → 0.36.2

package/dist/components/Header/Header.js

@@ -1,86 +1,88 @@
 "use client";
-import { jsxs as s, jsx as e } from "react/jsx-runtime";
-import { DropdownBase as i } from "../Dropdown/DropdownBase.js";
+import { jsxs as c, jsx as e } from "react/jsx-runtime";
+import { DropdownBase as h } from "../Dropdown/DropdownBase.js";
 import "../../index-L8X2o7IH.js";
-import { DrawerBase as p } from "../Dropdown/DrawerBase.js";
+import { DrawerBase as f } from "../Dropdown/DrawerBase.js";
 import "react";
-import { useRootContext as C } from "../RootProvider/RootProvider.js";
-import { GlobalMenu as m } from "../GlobalMenu/GlobalMenu.js";
-import { GlobalMenuButton as N } from "../GlobalMenu/GlobalMenuButton.js";
-import { HeaderBase as b } from "./HeaderBase.js";
-import { HeaderLogo as j } from "./HeaderLogo.js";
-import { LocaleButton as B } from "./LocaleButton.js";
-import { LocaleSwitcher as h } from "./LocaleSwitcher.js";
-import { Searchbar as H } from "../Searchbar/Searchbar.js";
+import { useRootContext as b } from "../RootProvider/RootProvider.js";
+import { GlobalMenu as w } from "../GlobalMenu/GlobalMenu.js";
+import { GlobalMenuButton as j } from "../GlobalMenu/GlobalMenuButton.js";
+import { HeaderBase as B } from "./HeaderBase.js";
+import { HeaderLogo as H } from "./HeaderLogo.js";
+import { LocaleButton as L } from "./LocaleButton.js";
+import { LocaleSwitcher as g } from "./LocaleSwitcher.js";
+import { Searchbar as u } from "../Searchbar/Searchbar.js";
 import "../Snackbar/useSnackbar.js";
-import { HeaderGroup as L } from "./HeaderGroup.js";
-import { HeaderSearch as S } from "./HeaderSearch.js";
-import '../../assets/Header.css';const k = "_drawer_1vzjh_1", y = "_dropdown_1vzjh_5", z = "_relative_1vzjh_19", a = {
-  drawer: k,
+import { HeaderGroup as S } from "./HeaderGroup.js";
+import { HeaderSearch as v } from "./HeaderSearch.js";
+import { useIsDesktop as D } from "../../hooks/useIsDesktop.js";
+import '../../assets/Header.css';const I = "_drawer_1vzjh_1", y = "_dropdown_1vzjh_5", z = "_relative_1vzjh_19", a = {
+  drawer: I,
   dropdown: y,
   relative: z
-}, W = ({ menu: r, locale: l, search: c, currentAccount: n, logo: f = {}, badge: w }) => {
-  const { currentId: o, toggleId: t, openId: g, closeAll: d } = C(), u = () => {
-    g("search");
-  }, v = () => {
+}, Z = ({ menu: r, locale: n, search: s, currentAccount: l, logo: x = {}, badge: C }) => {
+  const { currentId: o, toggleId: t, openId: _, closeAll: d } = b(), p = () => {
+    _("search");
+  }, i = () => {
     t("search");
-  }, _ = () => {
+  }, N = () => {
     t("menu");
-  }, x = () => {
+  }, k = () => {
     t("locale");
-  };
-  return /* @__PURE__ */ s(
-    b,
+  }, m = D();
+  return /* @__PURE__ */ c(
+    B,
     {
       currentId: o,
       open: o === "search" || o === "menu" || o === "locale",
       onClose: d,
       children: [
-        /* @__PURE__ */ e(j, { ...f, className: a.logo }),
-        /* @__PURE__ */ s(L, { children: [
-          l && /* @__PURE__ */ e("div", { className: a.relative, children: /* @__PURE__ */ e(B, { onClick: x, expanded: o === "locale" }) }),
-          /* @__PURE__ */ s("div", { className: a.relative, children: [
+        /* @__PURE__ */ e(H, { ...x, className: a.logo }),
+        s && m && /* @__PURE__ */ e(v, { expanded: o === "search", children: /* @__PURE__ */ e(u, { ...s, expanded: o === "search", onClose: i, onFocus: p }) }),
+        /* @__PURE__ */ c(S, { children: [
+          n && /* @__PURE__ */ e("div", { className: a.relative, children: /* @__PURE__ */ e(L, { onClick: k, expanded: o === "locale" }) }),
+          /* @__PURE__ */ c("div", { className: a.relative, children: [
             /* @__PURE__ */ e(
-              N,
+              j,
               {
-                badge: w,
-                currentAccount: n,
-                onClick: _,
+                badge: C,
+                currentAccount: l,
+                onClick: N,
                 expanded: o === "menu",
                 label: r == null ? void 0 : r.menuLabel
               }
             ),
-            l && /* @__PURE__ */ e(
-              i,
+            n && /* @__PURE__ */ e(
+              h,
               {
                 layout: "desktop",
                 padding: !0,
                 placement: "right",
                 open: o === "locale",
                 className: a.dropdown,
-                children: /* @__PURE__ */ e(h, { ...l })
+                children: /* @__PURE__ */ e(g, { ...n })
               }
             ),
             r && /* @__PURE__ */ e(
-              i,
+              h,
               {
                 layout: "desktop",
                 padding: !0,
                 placement: "right",
                 open: o === "menu",
                 className: a.dropdown,
-                children: /* @__PURE__ */ e(m, { ...r, currentAccount: n, onClose: d })
+                children: /* @__PURE__ */ e(w, { ...r, currentAccount: l, onClose: d })
               }
             )
           ] })
         ] }),
-        c && /* @__PURE__ */ e(S, { expanded: o === "search", children: /* @__PURE__ */ e(H, { ...c, expanded: o === "search", onClose: v, onFocus: u }) }),
-        l && /* @__PURE__ */ e(p, { open: o === "locale", className: a.drawer, children: /* @__PURE__ */ e(h, { ...l }) }),
-        r && /* @__PURE__ */ e(p, { open: o === "menu", className: a.drawer, children: /* @__PURE__ */ e(m, { ...r, currentAccount: n, onClose: d }) })
+        s && !m && /* @__PURE__ */ e(v, { expanded: o === "search", children: /* @__PURE__ */ e(u, { ...s, expanded: o === "search", onClose: i, onFocus: p }) }),
+        n && /* @__PURE__ */ e(f, { open: o === "locale", className: a.drawer, children: /* @__PURE__ */ e(g, { ...n }) }),
+        r && /* @__PURE__ */ e(f, { open: o === "menu", className: a.drawer, children: /* @__PURE__ */ e(w, { ...r, currentAccount: l, onClose: d }) })
       ]
     }
   );
 };
 export {
-  W as Header
+  Z as Header
 };

package/dist/hooks/useIsDesktop.js

@@ -0,0 +1,15 @@
+"use client";
+import { useState as s, useEffect as r } from "react";
+const e = 1024, d = () => {
+  const [i, n] = s(() => typeof window > "u" ? !1 : window.innerWidth >= e);
+  return r(() => {
+    n(window.innerWidth >= e);
+    const t = () => {
+      n(window.innerWidth >= e);
+    };
+    return window.addEventListener("resize", t), () => window.removeEventListener("resize", t);
+  }, []), i;
+};
+export {
+  d as useIsDesktop
+};

package/dist/types/lib/hooks/useIsDesktop.d.ts

@@ -0,0 +1 @@
+export declare const useIsDesktop: () => boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@altinn/altinn-components",
-  "version": "0.36.1",
+  "version": "0.36.2",
   "main": "dist/index.js",
   "files": [
     "dist/",