@midas-ds/components 16.7.0 → 16.8.0

package/chunks/Layout-C2-vyEKy.js

@@ -1,466 +0,0 @@
-import { jsx as e, jsxs as r, Fragment as H } from "react/jsx-runtime";
-import { G as S } from "./GridItem-z7zclNdT.js";
-import * as N from "react";
-import { useState as G, useEffect as W } from "react";
-import { c as u } from "./clsx-AexbMWKp.js";
-import { Link as L, RouterProvider as O } from "react-aria-components";
-import { B as M } from "./Button-CaLOUTDO.js";
-import { a as j, T as D } from "./Tooltip-rDmOkGmX.js";
-import { a as y, B as I } from "./BadgeContainer-CKVsfTlF.js";
-import { c as E } from "./createLucideIcon-CP-mMPfa.js";
-import { u as C } from "./useLocalizedStringFormatter-BHvsRxDk.js";
-import { variables as q } from "@midas-ds/theme";
-import { L as g } from "./Logo-CCxPAmgw.js";
-import { X as A } from "./x-B9bYxG31.js";
-import '../assets/Layout.css';const R = [
-  ["path", { d: "M4 5h16", key: "1tepv9" }],
-  ["path", { d: "M4 12h16", key: "1lakjw" }],
-  ["path", { d: "M4 19h16", key: "1djgab" }]
-], $ = E("menu", R);
-const F = [
-  ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
-  ["path", { d: "M9 3v18", key: "fh3hqa" }],
-  ["path", { d: "m16 15-3-3 3-3", key: "14y99z" }]
-], X = E("panel-left-close", F);
-const J = [
-  ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
-  ["path", { d: "M9 3v18", key: "fh3hqa" }],
-  ["path", { d: "m14 9 3 3-3 3", key: "8010ee" }]
-], K = E("panel-left-open", J), Q = "_baseLayout_1n71v_1", U = "_mainContent_1n71v_10", V = "_header_1n71v_15", Y = "_headerExternal_1n71v_26", Z = "_headerContent_1n71v_41", ee = "_logo_1n71v_60", ae = "_headerItems_1n71v_69", ne = "_toggleButton_1n71v_75", te = "_sidebar_1n71v_83", se = "_main_1n71v_10", ie = "_app_1n71v_116", re = "_sidebarOpened_1n71v_124", oe = "_sidebarHeader_1n71v_128", le = "_appName_1n71v_140", de = "_collapseButton_1n71v_147", ce = "_sidebarCollapsed_1n71v_156", me = "_userName_1n71v_166", pe = "_userTitle_1n71v_184", _e = "_title_1n71v_196", ve = "_sidebarNav_1n71v_207", ue = "_list_1n71v_213", he = "_listGroupTitle_1n71v_219", be = "_listItem_1n71v_226", Ne = "_listItemCollapsed_1n71v_231", fe = "_listLink_1n71v_235", ke = "_listLinkCollapsed_1n71v_298", Ce = "_active_1n71v_303", xe = "_backdrop_1n71v_321", ge = "_backdropOpened_1n71v_331", Le = "_skipToContent_1n71v_349", ye = "_navbar_1n71v_363", Ie = "_navbarList_1n71v_375", Me = "_navbarItem_1n71v_397", Ee = "_headerContentExternal_1n71v_448", Te = "_logoExternalContainer_1n71v_456", Se = "_logoExternal_1n71v_456", ze = "_logoExternalDesktop_1n71v_468", Be = "_navbarWrapper_1n71v_477", a = {
-  baseLayout: Q,
-  mainContent: U,
-  header: V,
-  headerExternal: Y,
-  headerContent: Z,
-  logo: ee,
-  headerItems: ae,
-  toggleButton: ne,
-  sidebar: te,
-  main: se,
-  app: ie,
-  sidebarOpened: re,
-  sidebarHeader: oe,
-  appName: le,
-  collapseButton: de,
-  sidebarCollapsed: ce,
-  userName: me,
-  userTitle: pe,
-  title: _e,
-  sidebarNav: ve,
-  list: ue,
-  listGroupTitle: he,
-  listItem: be,
-  listItemCollapsed: Ne,
-  listLink: fe,
-  listLinkCollapsed: ke,
-  active: Ce,
-  backdrop: xe,
-  backdropOpened: ge,
-  skipToContent: Le,
-  navbar: ye,
-  navbarList: Ie,
-  navbarItem: Me,
-  headerContentExternal: Ee,
-  logoExternalContainer: Te,
-  logoExternal: Se,
-  logoExternalDesktop: ze,
-  navbarWrapper: Be
-}, w = N.createContext(
-  void 0
-), Oe = ({
-  items: t,
-  title: s,
-  user: i,
-  app: n,
-  children: o,
-  clientSideRouter: m,
-  clientSideHref: d,
-  headerChildren: v,
-  isCollapsed: _,
-  setIsCollapsed: p,
-  isOpened: h,
-  setIsOpened: l,
-  variant: b,
-  id: f
-}) => /* @__PURE__ */ e(
-  w.Provider,
-  {
-    value: {
-      items: t,
-      title: s,
-      user: i,
-      app: n,
-      headerChildren: v,
-      isCollapsed: _,
-      setIsCollapsed: p,
-      isOpened: h,
-      setIsOpened: l,
-      clientSideRouter: m,
-      clientSideHref: d,
-      variant: b,
-      id: f
-    },
-    children: o
-  }
-), k = () => {
-  const t = N.useContext(w);
-  if (!t)
-    throw new Error("useLayoutContext must be used within a LayoutProvider");
-  return t;
-}, P = ({
-  title: t,
-  href: s,
-  icon: i,
-  active: n,
-  hasBadge: o
-}) => {
-  const { isCollapsed: m, setIsOpened: d, clientSideHref: v } = k(), _ = v ? v(s) : s, [p, h] = G(!1);
-  return W(() => {
-    if (typeof window < "u") {
-      const l = window.location.pathname === _ || window.location.pathname.startsWith(_ + "/");
-      h(n ?? l);
-    }
-  }, [n, _]), m ? /* @__PURE__ */ r(j, { children: [
-    /* @__PURE__ */ e(
-      L,
-      {
-        href: s,
-        "aria-label": t,
-        className: u(
-          a.listLink,
-          a.listLinkCollapsed,
-          p && a.active
-        ),
-        onPress: () => d?.(!1),
-        children: /* @__PURE__ */ r(y, { children: [
-          /* @__PURE__ */ e(
-            i,
-            {
-              size: 20,
-              "aria-label": t
-            }
-          ),
-          o && /* @__PURE__ */ e(I, {})
-        ] })
-      }
-    ),
-    /* @__PURE__ */ e(D, { placement: "right", children: t })
-  ] }) : /* @__PURE__ */ r(
-    L,
-    {
-      href: s,
-      "aria-label": t,
-      className: u(a.listLink, p && a.active),
-      onPress: () => d?.(!1),
-      children: [
-        /* @__PURE__ */ r(y, { children: [
-          /* @__PURE__ */ e(i, { size: 20 }),
-          o && /* @__PURE__ */ e(I, {})
-        ] }),
-        t
-      ]
-    }
-  );
-}, we = { closeMenu: "Close menu", openMenu: "Open menu", maximizeMenu: "Maximize menu", minimizeMenu: "Minimize menu", sidebarMenu: "Sidebar menu", bottomMenu: "Bottom menu", skipToContent: "Skip to main content" }, Pe = { closeMenu: "Stäng meny", openMenu: "Öppna meny", maximizeMenu: "Maximera meny", minimizeMenu: "Minimera meny", sidebarMenu: "Sidomeny", bottomMenu: "Bottenmeny", skipToContent: "Hoppa till huvudinnehåll" }, x = {
-  en: we,
-  sv: Pe
-}, He = () => {
-  const {
-    items: t,
-    app: s,
-    isOpened: i,
-    isCollapsed: n,
-    setIsCollapsed: o,
-    setIsOpened: m,
-    clientSideRouter: d,
-    clientSideHref: v,
-    id: _
-  } = k(), p = C(x), h = ({ group: l }) => /* @__PURE__ */ e("ul", { className: a.list, children: l.items.map((b, f) => /* @__PURE__ */ e(
-    "li",
-    {
-      className: u(
-        a.listItem,
-        n && a.listItemCollapsed
-      ),
-      children: /* @__PURE__ */ e(P, { ...b })
-    },
-    "link_" + f
-  )) });
-  return N.useEffect(() => {
-    const l = (b) => {
-      b.key === "Escape" && m !== void 0 && m(!1);
-    };
-    return window.addEventListener("keydown", l), () => {
-      window.removeEventListener("keydown", l);
-    };
-  }, [m]), /* @__PURE__ */ r(
-    "aside",
-    {
-      id: _,
-      className: u(
-        a.sidebar,
-        n && a.sidebarCollapsed,
-        i && a.sidebarOpened
-      ),
-      children: [
-        /* @__PURE__ */ r("div", { className: a.sidebarHeader, children: [
-          !n && /* @__PURE__ */ e("p", { className: a.appName, children: s.name }),
-          /* @__PURE__ */ e(
-            M,
-            {
-              variant: "icon",
-              "aria-label": n ? p.format("maximizeMenu") : p.format("minimizeMenu"),
-              onPress: () => o(!n),
-              className: a.collapseButton,
-              children: n ? /* @__PURE__ */ e(K, { size: 20 }) : /* @__PURE__ */ e(X, { size: 20 })
-            }
-          )
-        ] }),
-        /* @__PURE__ */ e(
-          "nav",
-          {
-            className: a.sidebarNav,
-            "aria-label": p.format("sidebarMenu"),
-            children: /* @__PURE__ */ e("ul", { className: a.list, children: t.map((l, b) => /* @__PURE__ */ r("li", { children: [
-              l.title && !n && /* @__PURE__ */ e("p", { className: a.listGroupTitle, children: l.title }),
-              d ? /* @__PURE__ */ e(
-                O,
-                {
-                  navigate: d,
-                  useHref: v,
-                  children: /* @__PURE__ */ e(h, { group: l })
-                }
-              ) : /* @__PURE__ */ e(h, { group: l })
-            ] }, "list_" + b)) })
-          }
-        )
-      ]
-    }
-  );
-}, Ge = () => {
-  const {
-    title: t,
-    user: s,
-    app: i,
-    isOpened: n,
-    setIsOpened: o,
-    setIsCollapsed: m,
-    headerChildren: d,
-    variant: v,
-    id: _
-  } = k(), p = C(x);
-  return v === "external" ? /* @__PURE__ */ e("header", { className: u(a.header, a.headerExternal), children: /* @__PURE__ */ r("div", { className: a.headerContentExternal, children: [
-    /* @__PURE__ */ r("div", { className: a.logoExternalContainer, children: [
-      /* @__PURE__ */ e(
-        g,
-        {
-          size: "x-small",
-          padding: !1,
-          className: a.logoExternal
-        }
-      ),
-      /* @__PURE__ */ e(
-        g,
-        {
-          size: "small",
-          padding: !1,
-          className: a.logoExternalDesktop
-        }
-      ),
-      /* @__PURE__ */ r("div", { children: [
-        /* @__PURE__ */ e("p", { className: a.userName, children: s.name }),
-        /* @__PURE__ */ e("p", { className: a.userTitle, children: s.title })
-      ] })
-    ] }),
-    /* @__PURE__ */ e("div", { className: a.headerItems, children: d })
-  ] }) }) : /* @__PURE__ */ r(
-    "header",
-    {
-      className: a.header,
-      style: {
-        borderTop: `solid 4px ${i.color ? i.color : q.brandPrimary}`
-      },
-      children: [
-        /* @__PURE__ */ r("div", { className: a.headerContent, children: [
-          /* @__PURE__ */ e("div", { className: a.logo, children: /* @__PURE__ */ e(
-            g,
-            {
-              size: "small",
-              padding: !1
-            }
-          ) }),
-          n !== void 0 && /* @__PURE__ */ e(
-            M,
-            {
-              variant: "icon",
-              className: a.toggleButton,
-              "aria-label": n ? p.format("closeMenu") : p.format("openMenu"),
-              "aria-controls": _,
-              onPressStart: () => {
-                m(!1), o?.(!0);
-              },
-              children: n ? /* @__PURE__ */ e(
-                A,
-                {
-                  size: 20,
-                  "aria-hidden": "true"
-                }
-              ) : /* @__PURE__ */ e(
-                $,
-                {
-                  size: 20,
-                  "aria-hidden": "true"
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ r("div", { children: [
-            /* @__PURE__ */ e("p", { className: a.userName, children: s.name }),
-            /* @__PURE__ */ e("p", { className: a.userTitle, children: s.title }),
-            /* @__PURE__ */ e("p", { className: a.title, children: t })
-          ] })
-        ] }),
-        /* @__PURE__ */ e("div", { className: a.headerItems, children: d })
-      ]
-    }
-  );
-}, z = ({
-  id: t = "main:first-of-type"
-}) => {
-  const s = () => {
-    const n = document.querySelector(t);
-    n && (n.tabIndex = -1, n.focus(), setTimeout(() => n.removeAttribute("tabindex"), 1e3));
-  }, i = C(x);
-  return /* @__PURE__ */ e(
-    M,
-    {
-      onPress: s,
-      className: a.skipToContent,
-      children: i.format("skipToContent")
-    }
-  );
-}, We = () => {
-  const { isOpened: t, setIsOpened: s } = k();
-  return t ? /* @__PURE__ */ e(
-    "div",
-    {
-      className: u(a.backdrop, a.backdropOpened),
-      onClick: () => {
-        s?.(!1);
-      },
-      "aria-hidden": !0
-    }
-  ) : null;
-}, je = () => {
-  const { items: t, clientSideRouter: s, clientSideHref: i } = k(), n = C(x), o = t.at(0)?.items;
-  return /* @__PURE__ */ e(
-    "nav",
-    {
-      className: a.navbar,
-      "aria-label": n.format("bottomMenu"),
-      children: o && /* @__PURE__ */ e("ul", { className: u(a.navbarList), children: s ? /* @__PURE__ */ e(
-        O,
-        {
-          navigate: s,
-          useHref: i,
-          children: /* @__PURE__ */ e(B, { items: o })
-        }
-      ) : /* @__PURE__ */ e(B, { items: o }) })
-    }
-  );
-}, B = ({
-  items: t
-}) => /* @__PURE__ */ e(H, { children: t.map(({ href: s, active: i, icon: n, title: o, hasBadge: m }, d) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ r(
-  L,
-  {
-    href: s,
-    className: u(a.navbarItem),
-    "data-active": i,
-    "aria-current": i && "page",
-    children: [
-      /* @__PURE__ */ r(y, { children: [
-        /* @__PURE__ */ e(n, { size: 20 }),
-        m && /* @__PURE__ */ e(I, {})
-      ] }),
-      o
-    ]
-  }
-) }, d)) }), c = ({
-  items: t,
-  title: s,
-  user: i,
-  app: n,
-  children: o,
-  headerChildren: m,
-  clientSideRouter: d,
-  clientSideHref: v,
-  variant: _,
-  className: p
-}) => {
-  const [h, l] = N.useState(!1), [b, f] = N.useState(!1), T = N.useId();
-  return _ === "external" ? /* @__PURE__ */ e(
-    c.Provider,
-    {
-      items: t,
-      title: s,
-      user: i,
-      app: n,
-      clientSideRouter: d,
-      clientSideHref: v,
-      headerChildren: m,
-      isCollapsed: h,
-      setIsCollapsed: l,
-      variant: _,
-      id: T,
-      children: /* @__PURE__ */ r("div", { className: u(a.baseLayout, p), children: [
-        /* @__PURE__ */ e(z, {}),
-        /* @__PURE__ */ e(c.Header, {}),
-        /* @__PURE__ */ r("div", { className: a.mainContent, children: [
-          /* @__PURE__ */ e(c.Sidebar, {}),
-          /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e("main", { className: a.main, children: /* @__PURE__ */ e("div", { className: a.app, children: o }) }) }),
-          /* @__PURE__ */ e(c.Backdrop, {})
-        ] }),
-        /* @__PURE__ */ e("div", { className: a.navbarWrapper, children: /* @__PURE__ */ e(c.Navbar, {}) })
-      ] })
-    }
-  ) : /* @__PURE__ */ e(
-    c.Provider,
-    {
-      items: t,
-      title: s,
-      user: i,
-      app: n,
-      clientSideRouter: d,
-      clientSideHref: v,
-      headerChildren: m,
-      isCollapsed: h,
-      setIsCollapsed: l,
-      isOpened: b,
-      setIsOpened: f,
-      variant: _,
-      id: T,
-      children: /* @__PURE__ */ r("div", { className: u(a.baseLayout, p), children: [
-        /* @__PURE__ */ e(z, {}),
-        /* @__PURE__ */ e(c.Header, {}),
-        /* @__PURE__ */ r("div", { className: a.mainContent, children: [
-          /* @__PURE__ */ e(c.Sidebar, {}),
-          /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e("main", { className: a.main, children: /* @__PURE__ */ e("div", { className: a.app, children: o }) }) }),
-          /* @__PURE__ */ e(c.Backdrop, {})
-        ] })
-      ] })
-    }
-  );
-};
-c.Provider = Oe;
-c.Header = Ge;
-c.Sidebar = He;
-c.SidebarLink = P;
-c.Navbar = je;
-c.Backdrop = We;
-export {
-  Ge as H,
-  c as L,
-  je as N,
-  He as S,
-  P as a
-};