@altinn/altinn-components 0.67.5 → 0.67.7

package/dist/LayoutBase-CrlzKACr.js

@@ -0,0 +1,19 @@
+import { jsx as t } from "react/jsx-runtime";
+import './assets/LayoutBase.css';const o = "_base_1084c_1", c = "_bannerWrapperPinned_1084c_14", d = {
+  base: o,
+  bannerWrapperPinned: c
+}, i = ({ currentId: e, color: n, theme: s, bannerHeight: a, children: r }) => /* @__PURE__ */ t(
+  "div",
+  {
+    className: d.base,
+    "data-color": n,
+    "data-theme": s,
+    "data-current-id": e,
+    style: a ? { "--altinn-banner-height": `${a}px` } : void 0,
+    children: r
+  }
+);
+export {
+  i as L,
+  d as s
+};

package/dist/assets/GlobalHeader.css

@@ -1 +1 @@
-._header_17ppp_1{z-index:1;background-color:#fff;width:100%}._container_17ppp_7{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;padding:.625rem;width:100%;max-width:1512px;margin:0 auto}._backdrop_17ppp_19{display:none}._header_17ppp_1[data-current-id=menu],._header_17ppp_1[data-current-id=locale]{background-color:#fff}@media(min-width:1024px){._header_17ppp_1[data-current-id=menu] ._backdrop_17ppp_19,._header_17ppp_1[data-current-id=locale] ._backdrop_17ppp_19{display:block}}@media(max-width:1023px){._header_17ppp_1{gap:0}}._header_17ppp_1{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}._nav_17ppp_53{position:relative;display:flex;align-items:center;justify-content:end;column-gap:1rem;width:100%}._logo_17ppp_62{margin-right:auto}
+._header_1apfp_1{z-index:1;background-color:#fff;width:100%}._header_1apfp_1[data-current-id=account],._header_1apfp_1[data-current-id=menu],._header_1apfp_1[data-current-id=locale]{position:fixed;top:var(--altinn-banner-height, 0px);left:0;right:0}._container_1apfp_21{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;padding:.625rem;width:100%;max-width:1512px;margin:0 auto}._backdrop_1apfp_33{display:none}._header_1apfp_1[data-current-id=menu],._header_1apfp_1[data-current-id=locale]{background-color:#fff}@media(min-width:1024px){._header_1apfp_1[data-current-id=menu] ._backdrop_1apfp_33,._header_1apfp_1[data-current-id=locale] ._backdrop_1apfp_33{display:block}}@media(max-width:1023px){._header_1apfp_1{gap:0}}._header_1apfp_1{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}._nav_1apfp_67{position:relative;display:flex;align-items:center;justify-content:end;column-gap:1rem;width:100%}._logo_1apfp_76{margin-right:auto}

package/dist/assets/HeaderDrawer.css

@@ -1 +1 @@
-html:has(dialog[open]){overflow:hidden;scrollbar-gutter:stable}._backdrop_yn0zc_11{display:block;z-index:1;background-color:#111d4640;position:fixed;top:calc(4.5rem + var(--altinn-banner-height, 0px));right:0;bottom:0;left:0;width:100%;height:100%}._backdrop_yn0zc_11[aria-hidden=true]{display:none}._drawer_yn0zc_28{position:fixed;z-index:2;background-color:#fff;width:100%;max-width:100vw;height:auto;max-height:none;box-sizing:border-box;padding:0;margin:0;border:0;top:calc(4.5rem + var(--altinn-banner-height, 0px));bottom:0;display:flex;flex-direction:column;overflow-y:scroll}._drawer_yn0zc_28::backdrop{background-color:transparent}._drawer_yn0zc_28:not([data-open=true]){display:none}._footer_yn0zc_60{display:none}._body_yn0zc_64{padding:0 .5rem}@media(min-width:1024px){._body_yn0zc_64{padding:0 1rem}._drawer_yn0zc_28{inset:auto;position:fixed;top:calc(4.5rem + var(--altinn-banner-height, 0px));left:0;right:0;margin:0;height:auto;max-height:55vh;overflow-y:auto}._drawer_yn0zc_28[data-expanded=true]{bottom:0;height:auto;max-height:none;overflow-y:scroll}._footer_yn0zc_60{position:sticky;z-index:2000;display:flex;bottom:0;left:0;right:0;justify-content:center;align-items:center;background-color:#fff}._toggleButton_yn0zc_104{margin:1rem 0}}
+html:has(dialog[open]){overflow:hidden;scrollbar-gutter:stable}._backdrop_c7eii_11{display:block;z-index:1;background-color:#111d4640;position:fixed;top:calc(4.5rem + var(--altinn-banner-height, 0px));right:0;bottom:0;left:0;width:100%;height:100%}._backdrop_c7eii_11[aria-hidden=true]{display:none}._drawer_c7eii_28{position:fixed;z-index:2;background-color:#fff;width:100%;max-width:100vw;height:auto;max-height:none;box-sizing:border-box;padding:0;margin:0;border:0;top:calc(4.5rem + var(--altinn-banner-height, 0px));bottom:0;display:flex;flex-direction:column;overflow-y:scroll;overscroll-behavior:contain}._drawer_c7eii_28::backdrop{background-color:transparent}._drawer_c7eii_28:not([data-open=true]){display:none}._footer_c7eii_62{display:none}._body_c7eii_66{padding:0 .5rem}@media(min-width:1024px){._body_c7eii_66{padding:0 1rem}._drawer_c7eii_28{inset:auto;position:fixed;top:calc(4.5rem + var(--altinn-banner-height, 0px));left:0;right:0;margin:0;height:auto;max-height:55vh;overflow-y:auto}._drawer_c7eii_28[data-expanded=true]{bottom:0;height:auto;max-height:none;overflow-y:scroll}._footer_c7eii_62{position:sticky;z-index:2000;display:flex;bottom:0;left:0;right:0;justify-content:center;align-items:center;background-color:#fff}._toggleButton_c7eii_106{margin:1rem 0}}

package/dist/assets/LayoutBase.css

@@ -1 +1 @@
-._base_1hj0u_1{position:relative;display:flex;flex-direction:column;min-height:100vh;background-color:var(--altinn-layout-background);--altinn-banner-height: 0px}._base_1hj0u_1[data-theme=default]{--altinn-layout-background: var(--ds-color-background-default)}._base_1hj0u_1[data-theme=subtle]{--altinn-layout-background: var(--ds-color-background-tinted)}._base_1hj0u_1[data-theme=neutral]{--altinn-layout-background: var(--ds-color-neutral-background-tinted)}._base_1hj0u_1[data-theme=inbox]{--altinn-layout-background: var(--ds-color-background-tinted)}._base_1hj0u_1[data-theme=inbox][data-color=person],._base_1hj0u_1[data-theme=settings]{--altinn-layout-background: var(--ds-color-neutral-background-tinted)}
+._base_1084c_1{position:relative;display:flex;flex-direction:column;min-height:100vh;background-color:var(--altinn-layout-background);--altinn-banner-height: 0px}._bannerWrapperPinned_1084c_14{position:fixed;top:0;left:0;right:0;z-index:2}._base_1084c_1[data-theme=default]{--altinn-layout-background: var(--ds-color-background-default)}._base_1084c_1[data-theme=subtle]{--altinn-layout-background: var(--ds-color-background-tinted)}._base_1084c_1[data-theme=neutral]{--altinn-layout-background: var(--ds-color-neutral-background-tinted)}._base_1084c_1[data-theme=inbox]{--altinn-layout-background: var(--ds-color-background-tinted)}._base_1084c_1[data-theme=inbox][data-color=person],._base_1084c_1[data-theme=settings]{--altinn-layout-background: var(--ds-color-neutral-background-tinted)}

package/dist/assets/SnackbarBase.css

@@ -1 +1 @@
-._stack_ilsfl_1{position:fixed;inset:auto 0 0;display:flex;flex-direction:column;row-gap:.5rem;padding:1rem;pointer-events:none}._stack_ilsfl_1>*{pointer-events:auto}@media(min-width:1024px){._stack_ilsfl_1{align-items:center}}
+._stack_1q54g_1{inset:auto 0 0;width:100%;margin:0;border:none;padding:1rem;background:transparent;overflow:visible;display:flex;flex-direction:column;row-gap:.5rem;pointer-events:none}._stack_1q54g_1>*{pointer-events:auto}@media(min-width:1024px){._stack_1q54g_1{align-items:center}}

package/dist/components/AccountSelector/AccountSelector.js

@@ -1,97 +1,104 @@
-import { jsx as a, jsxs as p } from "react/jsx-runtime";
-import { c as _ } from "../../index-p1eeF8LQ.js";
-import { useState as i, useRef as R, useEffect as b } from "react";
-import { AccountMenu as y } from "../Account/AccountMenu.js";
-import { r as F, H as I } from "../../tooltip-Ct39-719.js";
+import { jsx as r, jsxs as w } from "react/jsx-runtime";
+import { c as A } from "../../index-p1eeF8LQ.js";
+import { useState as i, useRef as l, useEffect as T } from "react";
+import { AccountMenu as M } from "../Account/AccountMenu.js";
+import { r as O, H as E } from "../../tooltip-Ct39-719.js";
 import "../Typography/Link.js";
 import "../Button/Button.js";
 import "react-dom";
-import { w as E, S as M } from "../../ToolbarSearch-DyVcALSw.js";
+import { w as q, S as P } from "../../ToolbarSearch-DyVcALSw.js";
 import "../GlobalMenu/GlobalMenuBase.js";
 import "../Snackbar/useSnackbar.js";
-import { Switch as O } from "../Forms/Switch.js";
-import '../../assets/AccountSelector.css';const V = "_accountSelector_ttjvg_1", W = "_heading_ttjvg_11", $ = "_searchSection_ttjvg_17", K = "_searchField_ttjvg_30", U = "_accountMenu_ttjvg_34", X = "_virtualized_ttjvg_42", q = "_spinner_ttjvg_51", c = {
-  accountSelector: V,
-  heading: W,
-  searchSection: $,
+import { Switch as V } from "../Forms/Switch.js";
+import '../../assets/AccountSelector.css';const W = "_accountSelector_ttjvg_1", $ = "_heading_ttjvg_11", B = "_searchSection_ttjvg_17", K = "_searchField_ttjvg_30", U = "_accountMenu_ttjvg_34", X = "_virtualized_ttjvg_42", Y = "_spinner_ttjvg_51", o = {
+  accountSelector: W,
+  heading: $,
+  searchSection: B,
   searchField: K,
   accountMenu: U,
   virtualized: X,
-  spinner: q
-}, B = 5, oe = ({
+  spinner: Y
+}, D = 5, G = typeof navigator < "u" && (/iP(hone|ad|od)/.test(navigator.userAgent) || // iPadOS 13+ reports itself as Mac
+navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1), de = ({
   accountMenu: e,
   forceOpenFullScreen: n,
-  className: r,
-  loading: A,
-  showDeletedUnits: l,
-  onShowDeletedUnitsChange: w,
-  isFullScreen: x,
-  accountCount: j
+  className: a,
+  loading: x,
+  showDeletedUnits: u,
+  onShowDeletedUnitsChange: j,
+  isFullScreen: k,
+  accountCount: C
 }) => {
-  const { closeAll: u, languageCode: d, currentId: k } = E(), s = k === "account" || !!n, h = (j ?? e.items.length) > B, g = l !== void 0, [m, v] = i(""), [C, S] = i(n), [N, T] = i(0), f = R(s);
-  b(() => {
-    s && !f.current && T((t) => t + 1), f.current = s;
-  }, [s]), b(() => {
-    !n && C && u(), S(n);
+  const { closeAll: d, languageCode: h, currentId: N } = q(), c = N === "account" || !!n, g = (C ?? e.items.length) > D, m = u !== void 0, [v, f] = i(""), [z, S] = i(n), [F, I] = i(0), p = l(c), _ = l(null), b = l(null);
+  T(() => {
+    c && !p.current && (I((t) => t + 1), requestAnimationFrame(() => {
+      b.current?.scrollTo({ top: 0 }), _.current?.closest("dialog")?.scrollTo({ top: 0 });
+    })), p.current = c;
+  }, [c]), T(() => {
+    !n && z && d(), S(n);
   }, [n]);
-  const { searchText: o, heading: z, switchLabel: L } = D(d), H = (t) => {
-    e.onSelectAccount?.(t), u(), S(!1);
+  const { searchText: s, heading: L, switchLabel: R } = J(h), H = () => {
+    G && requestAnimationFrame(() => window.scrollTo({ top: -window.scrollY, behavior: "instant" }));
+  }, y = (t) => {
+    e.onSelectAccount?.(t), d(), S(!1);
   };
-  return A ? /* @__PURE__ */ a(F, { "aria-hidden": !0, "data-color": "neutral", className: c.spinner }) : /* @__PURE__ */ p("div", { className: _(r, c.accountSelector), children: [
-    /* @__PURE__ */ a(I, { "data-size": "sm", level: 2, className: c.heading, id: "account-selector-heading", children: z }),
-    (h || g) && /* @__PURE__ */ p("div", { className: c.searchSection, children: [
-      h && /* @__PURE__ */ a(
-        M,
+  return x ? /* @__PURE__ */ r(O, { "aria-hidden": !0, "data-color": "neutral", className: o.spinner }) : /* @__PURE__ */ w("div", { ref: _, className: A(a, o.accountSelector), children: [
+    /* @__PURE__ */ r(E, { "data-size": "sm", level: 2, className: o.heading, id: "account-selector-heading", children: L }),
+    (g || m) && /* @__PURE__ */ w("div", { className: o.searchSection, children: [
+      g && /* @__PURE__ */ r(
+        P,
         {
           size: "sm",
           "aria-labelledby": "account-selector-heading",
-          label: o,
+          label: s,
           hideLabel: !0,
-          name: o,
-          placeholder: o,
-          value: m,
-          onChange: (t) => v(t.target.value),
-          onClear: () => v(""),
-          className: c.searchField
+          name: s,
+          placeholder: s,
+          value: v,
+          onChange: (t) => f(t.target.value),
+          onClear: () => f(""),
+          onBlur: H,
+          className: o.searchField
         }
       ),
-      g && /* @__PURE__ */ a(
-        O,
+      m && /* @__PURE__ */ r(
+        V,
         {
           size: "sm",
-          checked: l,
-          onChange: (t) => w?.(t.target.checked),
-          label: L
+          checked: u,
+          onChange: (t) => j?.(t.target.checked),
+          label: R
         }
       )
     ] }),
-    /* @__PURE__ */ a(
+    /* @__PURE__ */ r(
       "div",
       {
-        className: _(
-          c.accountMenu,
-          x && c.fullScreen,
-          e.virtualized && c.virtualized
+        ref: b,
+        className: A(
+          o.accountMenu,
+          k && o.fullScreen,
+          e.virtualized && o.virtualized
         ),
-        children: /* @__PURE__ */ a(
-          y,
+        children: /* @__PURE__ */ r(
+          M,
           {
             ...e,
-            onSelectAccount: H,
+            onSelectAccount: y,
             keyboardEvents: !1,
             search: {
               hidden: !0,
               name: "",
-              value: m,
-              getResultsLabel: (t) => G(t, d)
+              value: v,
+              getResultsLabel: (t) => Q(t, h)
             }
           },
-          N
+          F
         )
       }
     )
   ] });
-}, D = (e) => {
+}, J = (e) => {
   switch (e) {
     case "nn":
       return {
@@ -112,10 +119,10 @@ import '../../assets/AccountSelector.css';const V = "_accountSelector_ttjvg_1",
         switchLabel: "Vis slettede"
       };
   }
-}, G = (e, n) => {
-  const r = n === "nb" || n === "nn";
-  return e === 0 ? r ? "Ingen treff" : "No hits" : r ? `${e} treff` : e === 1 ? "1 hit" : `${e} hits`;
+}, Q = (e, n) => {
+  const a = n === "nb" || n === "nn";
+  return e === 0 ? a ? "Ingen treff" : "No hits" : a ? `${e} treff` : e === 1 ? "1 hit" : `${e} hits`;
 };
 export {
-  oe as AccountSelector
+  de as AccountSelector
 };

package/dist/components/GlobalHeader/GlobalHeader.js

@@ -1,46 +1,46 @@
 "use client";
-import { jsx as n, jsxs as p, Fragment as A } from "react/jsx-runtime";
-import { useState as O } from "react";
-import { useIsDesktop as v } from "../../hooks/useIsDesktop.js";
-import { AccountSelector as F } from "../AccountSelector/AccountSelector.js";
+import { jsx as n, jsxs as i, Fragment as O } from "react/jsx-runtime";
+import { useState as b } from "react";
+import { useIsDesktop as F } from "../../hooks/useIsDesktop.js";
+import { AccountSelector as v } from "../AccountSelector/AccountSelector.js";
 import { GlobalMenu as C } from "../GlobalMenu/GlobalMenu.js";
 import "../../index-p1eeF8LQ.js";
 import "../../tooltip-Ct39-719.js";
 import "../Typography/Link.js";
 import "../Button/Button.js";
 import "react-dom";
-import { w } from "../../ToolbarSearch-DyVcALSw.js";
-import { GlobalMenuButton as D } from "./GlobalMenuButton.js";
-import { GlobalAccountButton as M } from "./GlobalAccountButton.js";
+import { w as D } from "../../ToolbarSearch-DyVcALSw.js";
+import { GlobalMenuButton as M } from "./GlobalMenuButton.js";
+import { GlobalAccountButton as N } from "./GlobalAccountButton.js";
 import "../Snackbar/useSnackbar.js";
-import { HeaderDrawer as N } from "./HeaderDrawer.js";
-import { HeaderDropdown as E } from "./HeaderDropdown.js";
-import { HeaderLogo as I } from "./HeaderLogo.js";
-import '../../assets/GlobalHeader.css';const T = "_header_17ppp_1", k = "_container_17ppp_7", y = "_nav_17ppp_53", B = "_logo_17ppp_62", a = {
-  header: T,
-  container: k,
-  nav: y,
-  logo: B
-}, G = 5, $ = ({
+import { HeaderDrawer as E } from "./HeaderDrawer.js";
+import { HeaderDropdown as I } from "./HeaderDropdown.js";
+import { HeaderLogo as k } from "./HeaderLogo.js";
+import '../../assets/GlobalHeader.css';const w = "_header_1apfp_1", y = "_container_1apfp_21", B = "_nav_1apfp_67", G = "_logo_1apfp_76", a = {
+  header: w,
+  container: y,
+  nav: B,
+  logo: G
+}, H = 5, $ = ({
   globalMenu: r,
-  desktopMenu: s,
-  mobileMenu: d,
+  desktopMenu: d,
+  mobileMenu: p,
   locale: m,
   accountSelector: e,
   logo: u = {},
   badge: f,
   onLoginClick: g
 }) => {
-  const { currentId: o, toggleId: l, closeAll: t } = w(), h = () => {
-    o !== "account" && window.scrollTo({ top: 0, behavior: "instant" }), l("account");
+  const { currentId: o, toggleId: l, closeAll: t } = D(), h = () => {
+    l("account");
   }, _ = () => {
     l("menu");
-  }, c = o === "account" || e?.forceOpenFullScreen || !1, [i, b] = O(!1), x = v();
-  return /* @__PURE__ */ n("header", { className: a.header, "data-current-id": o, children: /* @__PURE__ */ n("div", { className: a.container, children: /* @__PURE__ */ p("nav", { className: a.nav, "aria-label": "hovednavigasjon", children: [
-    /* @__PURE__ */ n(I, { ...u, badge: f, className: a.logo }),
-    e && /* @__PURE__ */ p(A, { children: [
+  }, c = o === "account" || e?.forceOpenFullScreen || !1, [s, x] = b(!1), A = F();
+  return /* @__PURE__ */ n("header", { className: a.header, "data-current-id": o, children: /* @__PURE__ */ n("div", { className: a.container, children: /* @__PURE__ */ i("nav", { className: a.nav, "aria-label": "hovednavigasjon", children: [
+    /* @__PURE__ */ n(k, { ...u, badge: f, className: a.logo }),
+    e && /* @__PURE__ */ i(O, { children: [
       /* @__PURE__ */ n(
-        M,
+        N,
         {
           currentAccount: e.accountMenu?.currentAccount,
           onClick: e.accountMenu?.currentAccount ? h : g,
@@ -50,28 +50,28 @@ import '../../assets/GlobalHeader.css';const T = "_header_17ppp_1", k = "_contai
         }
       ),
       /* @__PURE__ */ n(
-        N,
+        E,
         {
           id: "header-account",
           open: c,
           onClose: t,
           closedBy: e?.forceOpenFullScreen ? "none" : "any",
           ariaLabelledby: "account-selector-heading",
-          expanded: e?.forceOpenFullScreen || i,
-          onToggle: () => b(!i),
-          expandable: (e.accountCount ?? e.accountMenu.items.length) > G,
-          children: /* @__PURE__ */ n(F, { ...e, forceOpenFullScreen: e.forceOpenFullScreen })
+          expanded: e?.forceOpenFullScreen || s,
+          onToggle: () => x(!s),
+          expandable: (e.accountCount ?? e.accountMenu.items.length) > H,
+          children: /* @__PURE__ */ n(v, { ...e, forceOpenFullScreen: e.forceOpenFullScreen })
         }
       )
     ] }),
     /* @__PURE__ */ n(
-      E,
+      I,
       {
         id: "header-menu",
         open: o === "menu",
         onClose: t,
         trigger: /* @__PURE__ */ n(
-          D,
+          M,
           {
             onClick: _,
             expanded: o === "menu",
@@ -83,7 +83,7 @@ import '../../assets/GlobalHeader.css';const T = "_header_17ppp_1", k = "_contai
           C,
           {
             ...r,
-            menu: x ? s || r?.menu : d || r?.menu,
+            menu: A ? d || r?.menu : p || r?.menu,
             onClose: t,
             localeSwitcher: m,
             isOpen: o === "menu"

package/dist/components/GlobalHeader/HeaderDrawer.js

@@ -1,4 +1,4 @@
-import { jsxs as a, Fragment as l, jsx as t } from "react/jsx-runtime";
+import { jsxs as a, Fragment as l, jsx as n } from "react/jsx-runtime";
 import { useRef as D, useEffect as h } from "react";
 import { Button as j } from "../Button/Button.js";
 import "../../index-p1eeF8LQ.js";
@@ -10,7 +10,7 @@ import "../GlobalMenu/GlobalMenuBase.js";
 import "../Snackbar/useSnackbar.js";
 import { S as L } from "../../ChevronUp-hn05LboH.js";
 import { S as M } from "../../ChevronDown-D_a7nb-G.js";
-import '../../assets/HeaderDrawer.css';const R = "_backdrop_yn0zc_11", B = "_drawer_yn0zc_28", F = "_footer_yn0zc_60", V = "_body_yn0zc_64", q = "_toggleButton_yn0zc_104", n = {
+import '../../assets/HeaderDrawer.css';const R = "_backdrop_c7eii_11", B = "_drawer_c7eii_28", F = "_footer_c7eii_62", V = "_body_c7eii_66", q = "_toggleButton_c7eii_106", t = {
   backdrop: R,
   drawer: B,
   footer: F,
@@ -18,7 +18,7 @@ import '../../assets/HeaderDrawer.css';const R = "_backdrop_yn0zc_11", B = "_dra
   toggleButton: q
 }, $ = ({
   id: c,
-  open: r,
+  open: i,
   onClose: v,
   closedBy: o = "any",
   expanded: d,
@@ -27,31 +27,31 @@ import '../../assets/HeaderDrawer.css';const R = "_backdrop_yn0zc_11", B = "_dra
   children: w,
   ariaLabelledby: k
 }) => {
-  const { languageCode: y } = I(), m = A(y), s = D(null);
+  const { languageCode: C } = I(), m = A(C), s = D(null);
   h(() => {
-    const e = s.current, u = (i) => {
+    const e = s.current, u = (r) => {
       if (window.getSelection()?.toString()) return;
-      const { clientY: g, clientX: p, target: C } = i;
-      if (e && C === e && o === "any") {
-        const { top: x, left: S, right: N, bottom: E } = e.getBoundingClientRect();
-        x <= g && g <= E && S <= p && p <= N || e.close();
+      const { clientY: g, clientX: p, target: S } = r;
+      if (e && S === e && o === "any") {
+        const { top: N, left: y, right: z, bottom: E } = e.getBoundingClientRect();
+        N <= g && g <= E && y <= p && p <= z || e.close();
       }
     }, f = () => {
-      const i = e?.querySelector("[autofocus]");
-      document.activeElement !== i && i?.focus();
+      const r = e?.querySelector("[autofocus]");
+      document.activeElement !== r && r?.focus();
     };
     return e?.addEventListener("animationend", f), e?.addEventListener("click", u), () => {
       e?.removeEventListener("animationend", f), e?.removeEventListener("click", u);
     };
   }, [o]), h(() => {
     const e = s.current;
-    e && (r ? e.open || e.showModal() : e.open && e.close());
-  }, [r]);
-  const z = (e) => {
+    e && (i ? e.open || e.showModal() : e.open && e.close());
+  }, [i]);
+  const x = (e) => {
     o === "none" && e.preventDefault();
   };
   return /* @__PURE__ */ a(l, { children: [
-    /* @__PURE__ */ t("div", { className: n.backdrop, "aria-hidden": !r }),
+    /* @__PURE__ */ n("div", { className: t.backdrop, "aria-hidden": !i }),
     /* @__PURE__ */ a(
       "dialog",
       {
@@ -59,18 +59,18 @@ import '../../assets/HeaderDrawer.css';const R = "_backdrop_yn0zc_11", B = "_dra
         ref: s,
         "aria-modal": "true",
         "aria-labelledby": k,
-        "data-open": r,
+        "data-open": i,
         "data-expanded": d,
-        onCancel: z,
-        className: n.drawer,
+        onCancel: x,
+        className: t.drawer,
         onClose: o !== "none" ? v : void 0,
         children: [
-          /* @__PURE__ */ t("div", { className: n.body, children: w }),
-          o !== "none" && _ && /* @__PURE__ */ t("footer", { className: n.footer, children: /* @__PURE__ */ t(j, { className: n.toggleButton, size: "xs", variant: "outline", onClick: b, children: d ? /* @__PURE__ */ a(l, { children: [
-            /* @__PURE__ */ t(L, { className: n.btnIcon, "aria-hidden": "true" }),
+          /* @__PURE__ */ n("div", { className: t.body, children: w }),
+          o !== "none" && _ && /* @__PURE__ */ n("footer", { className: t.footer, children: /* @__PURE__ */ n(j, { className: t.toggleButton, size: "xs", variant: "outline", onClick: b, children: d ? /* @__PURE__ */ a(l, { children: [
+            /* @__PURE__ */ n(L, { className: t.btnIcon, "aria-hidden": "true" }),
             m.minimize
           ] }) : /* @__PURE__ */ a(l, { children: [
-            /* @__PURE__ */ t(M, { className: n.btnIcon, "aria-hidden": "true" }),
+            /* @__PURE__ */ n(M, { className: t.btnIcon, "aria-hidden": "true" }),
             m.fullscreen
           ] }) }) })
         ]

package/dist/components/Layout/Layout.js

@@ -1,7 +1,7 @@
 "use client";
-import { jsxs as e, jsx as t, Fragment as L } from "react/jsx-runtime";
-import { useRef as v, useState as B, useEffect as x } from "react";
-import { L as R, s as S } from "../../LayoutBase-CAdjuw9Q.js";
+import { jsxs as i, jsx as t, Fragment as v } from "react/jsx-runtime";
+import { useRef as L, useState as B, useEffect as x } from "react";
+import { L as R, s as S } from "../../LayoutBase-CrlzKACr.js";
 import { LayoutGrid as H } from "./LayoutGrid.js";
 import { LayoutBody as z } from "./LayoutBody.js";
 import { LayoutContent as j } from "./LayoutContent.js";
@@ -22,16 +22,16 @@ import { SkipLink as N } from "../SkipLink/SkipLink.js";
 const ro = ({
   banner: o,
   color: u,
-  theme: h = "subtle",
+  theme: d = "subtle",
   header: n,
-  footer: m,
+  footer: c,
   sidebar: r,
-  content: d = {},
+  content: h = {},
   children: y,
-  skipLink: c,
+  skipLink: m,
   breadcrumbs: l
 }) => {
-  const { currentId: i } = E(), s = v(null), [k, g] = B(0);
+  const { currentId: e } = E(), s = L(null), [k, g] = B(0);
   return x(() => {
     const f = s.current;
     if (!f) return;
@@ -39,27 +39,35 @@ const ro = ({
       g(a.borderBoxSize[0]?.blockSize ?? a.contentRect.height);
     });
     return p.observe(f), () => p.disconnect();
-  }, []), /* @__PURE__ */ e(R, { color: u, theme: h, currentId: i, bannerHeight: o ? k : 0, children: [
-    c && /* @__PURE__ */ t(N, { ...c }),
-    o && /* @__PURE__ */ t("div", { ref: s, className: S.bannerWrapper, "data-color": "company", children: /* @__PURE__ */ t(
-      C,
+  }, []), /* @__PURE__ */ i(R, { color: u, theme: d, currentId: e, bannerHeight: o ? k : 0, children: [
+    m && /* @__PURE__ */ t(N, { ...m }),
+    o && /* @__PURE__ */ t(
+      "div",
       {
-        title: o.link ? /* @__PURE__ */ e(L, { children: [
-          o.title,
-          " ",
-          /* @__PURE__ */ t("a", { href: o.link.href, target: "_blank", rel: "noreferrer", children: o.link.label })
-        ] }) : o.title,
-        color: o.color,
-        variant: o.variant || "strong",
-        icon: o.icon,
-        sticky: !1
+        ref: s,
+        className: e === "account" || e === "menu" || e === "locale" ? S.bannerWrapperPinned : void 0,
+        "data-color": "company",
+        children: /* @__PURE__ */ t(
+          C,
+          {
+            title: o.link ? /* @__PURE__ */ i(v, { children: [
+              o.title,
+              " ",
+              /* @__PURE__ */ t("a", { href: o.link.href, target: "_blank", rel: "noreferrer", children: o.link.label })
+            ] }) : o.title,
+            color: o.color,
+            variant: o.variant || "strong",
+            icon: o.icon,
+            sticky: !1
+          }
+        )
       }
-    ) }),
+    ),
     n && /* @__PURE__ */ t(M, { ...n }),
-    /* @__PURE__ */ e(H, { currentId: i, children: [
+    /* @__PURE__ */ i(H, { currentId: e, children: [
       l && /* @__PURE__ */ t(F, { ...l }),
-      /* @__PURE__ */ e(z, { currentId: i, children: [
-        r && /* @__PURE__ */ e(
+      /* @__PURE__ */ i(z, { currentId: e, children: [
+        r && /* @__PURE__ */ i(
           w,
           {
             sticky: r?.sticky,
@@ -72,10 +80,10 @@ const ro = ({
             ]
           }
         ),
-        /* @__PURE__ */ t(j, { color: d?.color, id: "main-content", children: y })
+        /* @__PURE__ */ t(j, { color: h?.color, id: "main-content", children: y })
       ] })
     ] }),
-    m && /* @__PURE__ */ t(G, { ...m })
+    c && /* @__PURE__ */ t(G, { ...c })
   ] });
 };
 export {

package/dist/components/Layout/LayoutBase.js

@@ -1,5 +1,5 @@
 import "react/jsx-runtime";
-import { L as t } from "../../LayoutBase-CAdjuw9Q.js";
+import { L as t } from "../../LayoutBase-CrlzKACr.js";
 export {
   t as LayoutBase
 };

package/dist/components/Layout/index.js

@@ -1,4 +1,4 @@
-import { L as t } from "../../LayoutBase-CAdjuw9Q.js";
+import { L as t } from "../../LayoutBase-CrlzKACr.js";
 import { LayoutGrid as e } from "./LayoutGrid.js";
 import { LayoutBody as L } from "./LayoutBody.js";
 import { LayoutContent as m } from "./LayoutContent.js";

package/dist/components/Snackbar/Snackbar.js

@@ -1,27 +1,30 @@
 "use client";
-import { jsx as n } from "react/jsx-runtime";
-import { SnackbarBase as l } from "./SnackbarBase.js";
-import { SnackbarItem as d } from "./SnackbarItem.js";
-import { useSnackbar as b } from "./useSnackbar.js";
-const u = 0.3, S = 0.4, y = ({ className: e }) => {
-  const { storedMessages: o, open: r, closeSnackbarItem: a } = b();
-  if (!r)
-    return null;
-  const t = o || [], c = t.length - 1;
-  return /* @__PURE__ */ n(l, { className: e, children: t.map((s, i) => {
-    const m = c - i, p = Math.max(S, 1 - m * u);
-    return /* @__PURE__ */ n(
-      d,
+import { jsx as r } from "react/jsx-runtime";
+import { useRef as l, useEffect as d } from "react";
+import { SnackbarBase as u } from "./SnackbarBase.js";
+import { SnackbarItem as b } from "./SnackbarItem.js";
+import { useSnackbar as h } from "./useSnackbar.js";
+const S = 0.3, k = 0.4, w = ({ className: n }) => {
+  const { storedMessages: c, open: s, closeSnackbarItem: a } = h(), o = l(null);
+  d(() => {
+    const e = o.current;
+    e && (s ? e.showPopover() : e.matches(":popover-open") && e.hidePopover());
+  }, [s]);
+  const t = c || [], i = t.length - 1;
+  return /* @__PURE__ */ r(u, { ref: o, className: n, children: t.map((e, p) => {
+    const m = i - p, f = Math.max(k, 1 - m * S);
+    return /* @__PURE__ */ r(
+      b,
       {
-        onDismiss: () => a(s.id),
-        dismissable: s.dismissable,
-        style: { opacity: p },
-        ...s
+        onDismiss: () => a(e.id),
+        dismissable: e.dismissable,
+        style: { opacity: f },
+        ...e
       },
-      s.id
+      e.id
     );
   }) });
 };
 export {
-  y as Snackbar
+  w as Snackbar
 };

package/dist/components/Snackbar/SnackbarBase.js

@@ -1,7 +1,7 @@
-import { jsx as t } from "react/jsx-runtime";
-import '../../assets/SnackbarBase.css';const c = "_stack_ilsfl_1", a = {
+import { jsx as a } from "react/jsx-runtime";
+import '../../assets/SnackbarBase.css';const c = "_stack_1q54g_1", o = {
   stack: c
-}, e = ({ children: s }) => /* @__PURE__ */ t("section", { className: a.stack, children: s });
+}, n = ({ children: s, ref: t }) => /* @__PURE__ */ a("section", { ref: t, popover: "manual", className: o.stack, children: s });
 export {
-  e as SnackbarBase
+  n as SnackbarBase
 };

package/dist/components/Snackbar/SnackbarItem.js

@@ -1,59 +1,78 @@
 "use client";
-import { jsx as i, jsxs as f } from "react/jsx-runtime";
-import { c as u } from "../../index-p1eeF8LQ.js";
-import { I as v, s as _ } from "../../ToolbarSearch-DyVcALSw.js";
-import a, { forwardRef as g } from "react";
+import { jsx as a, jsxs as v } from "react/jsx-runtime";
+import { c as h } from "../../index-p1eeF8LQ.js";
+import d, { forwardRef as _, useEffect as g } from "react";
+import { I as b, s as y } from "../../ToolbarSearch-DyVcALSw.js";
 import "../../tooltip-Ct39-719.js";
 import "../Typography/Link.js";
-import { Button as h } from "../Button/Button.js";
+import { Button as w } from "../Button/Button.js";
 import "react-dom";
 import "../GlobalMenu/GlobalMenuBase.js";
 import "./useSnackbar.js";
-import { u as y } from "../../useId-BVFxCjkq.js";
-import '../../assets/SnackbarItem.css';var w = function(e, o) {
-  var n = {};
-  for (var t in e) Object.prototype.hasOwnProperty.call(e, t) && o.indexOf(t) < 0 && (n[t] = e[t]);
+import { u as x } from "../../useId-BVFxCjkq.js";
+import '../../assets/SnackbarItem.css';var O = function(e, n) {
+  var i = {};
+  for (var t in e) Object.prototype.hasOwnProperty.call(e, t) && n.indexOf(t) < 0 && (i[t] = e[t]);
   if (e != null && typeof Object.getOwnPropertySymbols == "function")
     for (var r = 0, t = Object.getOwnPropertySymbols(e); r < t.length; r++)
-      o.indexOf(t[r]) < 0 && Object.prototype.propertyIsEnumerable.call(e, t[r]) && (n[t[r]] = e[t[r]]);
-  return n;
+      n.indexOf(t[r]) < 0 && Object.prototype.propertyIsEnumerable.call(e, t[r]) && (i[t[r]] = e[t[r]]);
+  return i;
 };
-const O = g((e, o) => {
-  var { title: n, titleId: t } = e, r = w(e, ["title", "titleId"]);
-  let l = y();
-  return l = n ? t || "title-" + l : void 0, a.createElement(
+const I = _((e, n) => {
+  var { title: i, titleId: t } = e, r = O(e, ["title", "titleId"]);
+  let l = x();
+  return l = i ? t || "title-" + l : void 0, d.createElement(
     "svg",
-    Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24", focusable: !1, role: "img", ref: o, "aria-labelledby": l }, r),
-    n ? a.createElement("title", { id: l }, n) : null,
-    a.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M12.75 2.5a.75.75 0 0 0-1.5 0v1.273c-2.222.14-3.655.92-4.499 2.186-.887 1.33-1.001 3.04-1.001 4.541v3c0 .809-.424 1.92-.92 2.915a18 18 0 0 1-.936 1.641l-.014.022-.004.006A.75.75 0 0 0 4.5 19.25h4.338a3.25 3.25 0 0 0 6.324 0H19.5a.75.75 0 0 0 .624-1.166l-.004-.006-.014-.022-.06-.091c-.05-.081-.125-.2-.215-.35-.18-.301-.42-.722-.66-1.2-.497-.994-.921-2.106-.921-2.915v-3c0-1.501-.114-3.21-1.001-4.541-.844-1.266-2.277-2.046-4.499-2.186zm-1.987 17.237a1.8 1.8 0 0 1-.344-.487h3.162a1.75 1.75 0 0 1-1.581 1 1.75 1.75 0 0 1-1.237-.513", clipRule: "evenodd" })
+    Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24", focusable: !1, role: "img", ref: n, "aria-labelledby": l }, r),
+    i ? d.createElement("title", { id: l }, i) : null,
+    d.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M12.75 2.5a.75.75 0 0 0-1.5 0v1.273c-2.222.14-3.655.92-4.499 2.186-.887 1.33-1.001 3.04-1.001 4.541v3c0 .809-.424 1.92-.92 2.915a18 18 0 0 1-.936 1.641l-.014.022-.004.006A.75.75 0 0 0 4.5 19.25h4.338a3.25 3.25 0 0 0 6.324 0H19.5a.75.75 0 0 0 .624-1.166l-.004-.006-.014-.022-.06-.091c-.05-.081-.125-.2-.215-.35-.18-.301-.42-.722-.66-1.2-.497-.994-.921-2.106-.921-2.915v-3c0-1.501-.114-3.21-1.001-4.541-.844-1.266-2.277-2.046-4.499-2.186zm-1.987 17.237a1.8 1.8 0 0 1-.344-.487h3.162a1.75 1.75 0 0 1-1.581 1 1.75 1.75 0 0 1-1.237-.513", clipRule: "evenodd" })
   );
-}), b = "_item_18ro3_1", x = "_itemWrapper_18ro3_24", I = "_icon_18ro3_29", j = "_content_18ro3_39", N = "_action_18ro3_47", c = {
-  item: b,
-  itemWrapper: x,
-  icon: I,
-  content: j,
-  action: N
+}), j = "_item_18ro3_1", A = "_itemWrapper_18ro3_24", N = "_icon_18ro3_29", S = "_content_18ro3_39", B = "_action_18ro3_47", c = {
+  item: j,
+  itemWrapper: A,
+  icon: N,
+  content: S,
+  action: B
 };
-var B = /* @__PURE__ */ ((e) => (e.company = "company", e.success = "success", e.warning = "warning", e.danger = "danger", e.info = "info", e))(B || {});
-const X = ({
+var R = /* @__PURE__ */ ((e) => (e.company = "company", e.success = "success", e.warning = "warning", e.danger = "danger", e.info = "info", e))(R || {});
+const T = ({
   as: e,
-  message: o,
-  className: n,
+  message: n,
+  className: i,
   color: t,
-  icon: r = O,
+  icon: r = I,
   iconAltText: l = "Bell icon",
-  dismissable: s = !0,
+  dismissable: p = !0,
   onDismiss: m,
-  ...d
+  ...f
 }) => {
-  const p = e || "div";
-  return /* @__PURE__ */ i("span", { className: c.itemWrapper, children: /* @__PURE__ */ f(p, { className: u(c.item, n), "data-color": t, role: "alert", ...d, children: [
-    /* @__PURE__ */ i(v, { svgElement: r, className: c.icon, "aria-hidden": "true" }),
-    /* @__PURE__ */ i("div", { className: c.content, children: o }),
-    s && /* @__PURE__ */ i("div", { className: c.action, children: /* @__PURE__ */ i(h, { variant: "solid", onClick: m, "aria-label": "close", children: /* @__PURE__ */ i(_, { style: { fontSize: "1.5em" } }) }) })
+  const u = e || "div";
+  return g(() => {
+    if (!n)
+      return;
+    const s = document.querySelector("dialog[open]");
+    if (!s)
+      return;
+    let o = s.querySelector("[data-snackbar-live]");
+    o || (o = document.createElement("div"), o.setAttribute("data-snackbar-live", ""), o.setAttribute("aria-live", "polite"), o.setAttribute("aria-atomic", "true"), Object.assign(o.style, {
+      position: "absolute",
+      width: "1px",
+      height: "1px",
+      padding: "0",
+      overflow: "hidden",
+      clip: "rect(0,0,0,0)",
+      whiteSpace: "nowrap",
+      border: "0"
+    }), s.appendChild(o)), o.textContent = "", requestAnimationFrame(() => {
+      o.textContent = n;
+    });
+  }, [n]), /* @__PURE__ */ a("span", { className: c.itemWrapper, children: /* @__PURE__ */ v(u, { className: h(c.item, i), "data-color": t, role: "alert", ...f, children: [
+    /* @__PURE__ */ a(b, { svgElement: r, className: c.icon, "aria-hidden": "true" }),
+    /* @__PURE__ */ a("div", { className: c.content, children: n }),
+    p && /* @__PURE__ */ a("div", { className: c.action, children: /* @__PURE__ */ a(w, { variant: "solid", onClick: m, "aria-label": "close", children: /* @__PURE__ */ a(y, { style: { fontSize: "1.5em" } }) }) })
   ] }) });
 };
 export {
-  B as SnackbarColorEnum,
-  X as SnackbarItem
+  R as SnackbarColorEnum,
+  T as SnackbarItem
 };

package/dist/components/index.js

@@ -69,7 +69,7 @@ import { ItemControls as pe } from "./Item/ItemControls.js";
 import { ItemSelect as xe } from "./Item/ItemSelect.js";
 import { ItemBase as se } from "./Item/ItemBase.js";
 import { ItemLink as le } from "./Item/ItemLink.js";
-import { L as ue } from "../LayoutBase-CAdjuw9Q.js";
+import { L as ue } from "../LayoutBase-CrlzKACr.js";
 import { LayoutGrid as ge } from "./Layout/LayoutGrid.js";
 import { LayoutBody as Le } from "./Layout/LayoutBody.js";
 import { LayoutContent as Ie } from "./Layout/LayoutContent.js";

package/dist/hooks/useLockBodyScroll.js

@@ -1,14 +1,21 @@
 "use client";
-import { useEffect as n } from "react";
-const c = (t) => {
-  n(() => {
-    if (!t) return;
-    const { overflow: e, paddingRight: d } = document.body.style, o = window.innerWidth - document.documentElement.clientWidth;
-    return document.body.style.overflow = "hidden", o > 0 && (document.body.style.paddingRight = `${o}px`), () => {
-      document.body.style.overflow = e, document.body.style.paddingRight = d;
+import { useEffect as s } from "react";
+const l = typeof navigator < "u" && (/iP(hone|ad|od)/.test(navigator.userAgent) || // iPadOS 13+ reports itself as Mac
+navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1), r = (e) => {
+  s(() => {
+    if (!e || !l) return;
+    const { body: t } = document, { scrollY: i } = window, o = {
+      position: t.style.position,
+      top: t.style.top,
+      left: t.style.left,
+      right: t.style.right,
+      width: t.style.width
     };
-  }, [t]);
+    return t.style.position = "fixed", t.style.top = `-${i}px`, t.style.left = "0", t.style.right = "0", t.style.width = "100%", () => {
+      t.style.position = o.position, t.style.top = o.top, t.style.left = o.left, t.style.right = o.right, t.style.width = o.width, window.scrollTo(0, i);
+    };
+  }, [e]);
 };
 export {
-  c as useLockBodyScroll
+  r as useLockBodyScroll
 };

package/dist/index.js

@@ -69,7 +69,7 @@ import { ItemControls as pe } from "./components/Item/ItemControls.js";
 import { ItemSelect as ie } from "./components/Item/ItemSelect.js";
 import { ItemBase as se } from "./components/Item/ItemBase.js";
 import { ItemLink as ce } from "./components/Item/ItemLink.js";
-import { L as ue } from "./LayoutBase-CAdjuw9Q.js";
+import { L as ue } from "./LayoutBase-CrlzKACr.js";
 import { LayoutGrid as ge } from "./components/Layout/LayoutGrid.js";
 import { LayoutBody as Le } from "./components/Layout/LayoutBody.js";
 import { LayoutContent as Ie } from "./components/Layout/LayoutContent.js";

package/dist/types/lib/components/Snackbar/Snackbar.d.ts

@@ -2,4 +2,4 @@ export interface SnackbarProps {
     /** Optional classname */
     className?: string;
 }
-export declare const Snackbar: ({ className }: SnackbarProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const Snackbar: ({ className }: SnackbarProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Snackbar/Snackbar.stories.d.ts

@@ -1,6 +1,6 @@
 declare const meta: {
     title: string;
-    component: ({ className }: import('./Snackbar.tsx').SnackbarProps) => import("react/jsx-runtime").JSX.Element | null;
+    component: ({ className }: import('./Snackbar.tsx').SnackbarProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {};
     args: {};

package/dist/types/lib/components/Snackbar/SnackbarBase.d.ts

@@ -1,8 +1,9 @@
-import { ReactNode } from 'react';
+import { ReactNode, Ref } from 'react';
 export interface SnackbarBaseProps {
     /** Optional classname */
     className?: string;
     /** Children */
     children: string | ReactNode;
+    ref?: Ref<HTMLElement>;
 }
-export declare const SnackbarBase: ({ children }: SnackbarBaseProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SnackbarBase: ({ children, ref }: SnackbarBaseProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1 +1,18 @@
+/**
+ * Locks background scroll while a header overlay (drawer) is open.
+ *
+ * Non-iOS platforms are already handled globally by the
+ * `html:has(dialog[open]) { overflow: hidden }` rule, so this hook only adds the
+ * part CSS can't do: iOS Safari ignores `overflow: hidden` on body/html for
+ * touch scrolling, so a short / non-scrollable overlay lets the gesture chain to
+ * the page behind it (and rubber-band the whole viewport). Pinning <body> with
+ * `position: fixed` removes it from the scroll flow entirely — the only reliable
+ * lock on iOS.
+ *
+ * The page keeps its scroll position (`top: -scrollY`); it doesn't need to be at
+ * the top because the header is pinned independently (via `position: fixed`
+ * while the overlay is open, see globalHeader.module.css), so the overlay stays
+ * aligned regardless of scroll. The locked background is covered by the overlay
+ * anyway. The scroll position is restored on close.
+ */
 export declare const useLockBodyScroll: (locked: boolean) => void;

package/package.json

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

package/dist/LayoutBase-CAdjuw9Q.js

@@ -1,18 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-import './assets/LayoutBase.css';const n = "_base_1hj0u_1", c = {
-  base: n
-}, i = ({ currentId: s, color: t, theme: e, bannerHeight: a, children: o }) => /* @__PURE__ */ r(
-  "div",
-  {
-    className: c.base,
-    "data-color": t,
-    "data-theme": e,
-    "data-current-id": s,
-    style: a ? { "--altinn-banner-height": `${a}px` } : void 0,
-    children: o
-  }
-);
-export {
-  i as L,
-  c as s
-};