@midas-ds/components 1.0.2

package/index79.js

@@ -0,0 +1,274 @@
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { LinkButton as f } from "./index78.js";
+import { Button as k } from "./index69.js";
+import { c as h } from "./clsx-OuTLNxxd.js";
+import { FlexItem as N } from "./index47.js";
+import { Logo as g } from "./index73.js";
+import b from "react";
+import { m as v } from "./tokens-CjXmpXTi.js";
+import { Dropdown as x, DropdownItem as C } from "./index76.js";
+import { $ as L } from "./useFocusRing-D97-G3fT.js";
+import { c as y } from "./createLucideIcon-DeWljiyi.js";
+import { X as T } from "./x-JK7i-TQC.js";
+import './Layout.css';/**
+ * @license lucide-react v0.453.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const I = y("Menu", [
+  ["line", { x1: "4", x2: "20", y1: "12", y2: "12", key: "1e0a9i" }],
+  ["line", { x1: "4", x2: "20", y1: "6", y2: "6", key: "1owob3" }],
+  ["line", { x1: "4", x2: "20", y1: "18", y2: "18", key: "yk5zj1" }]
+]);
+/**
+ * @license lucide-react v0.453.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const B = y("PanelLeftClose", [
+  ["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" }]
+]);
+/**
+ * @license lucide-react v0.453.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const M = y("PanelRightClose", [
+  ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
+  ["path", { d: "M15 3v18", key: "14nvp0" }],
+  ["path", { d: "m8 9 3 3-3 3", key: "12hl5m" }]
+]), P = '"../theme/tokens.css"', H = '"Inter", sans-serif', O = "#143c50", z = "#f2f2f2", E = "#d9d9d9", F = "#b3b3b3", $ = "#a6a6a6", G = "#5d5d5d", S = "(min-width: 768px)", j = "#b90835", D = "_baseLayout_1w6p5_4", R = "_mainContent_1w6p5_13", q = "_header_1w6p5_18", X = "_headerContent_1w6p5_35", A = "_headerItems_1w6p5_52", J = "_logo_1w6p5_53", K = "_headerMenu_1w6p5_61", Q = "_toggleButton_1w6p5_69", U = "_sidebar_1w6p5_77", V = "_main_1w6p5_13", W = "_app_1w6p5_112", Y = "_sidebarOpened_1w6p5_121", Z = "_sidebarHeader_1w6p5_125", ee = "_sidebarFooter_1w6p5_134", ae = "_sidebarCollapsed_1w6p5_148", te = "_userName_1w6p5_165", se = "_abbr_1w6p5_177", ne = "_userTitle_1w6p5_183", ie = "_title_1w6p5_194", re = "_sidebarNav_1w6p5_205", oe = "_list_1w6p5_211", le = "_listGroupTitle_1w6p5_218", de = "_listItem_1w6p5_227", ce = "_listItemCollapsed_1w6p5_231", me = "_listLink_1w6p5_235", pe = "_linkText_1w6p5_242", _e = "_linkTextCollapsed_1w6p5_252", he = "_listLinkCollapsed_1w6p5_263", be = "_collapseButton_1w6p5_267", ye = "_backdrop_1w6p5_272", ue = "_backdropOpened_1w6p5_281", a = {
+  tokens: P,
+  display: H,
+  primaryBackground: O,
+  gray10: z,
+  gray30: E,
+  gray60: F,
+  gray70: $,
+  gray130: G,
+  mdBreakpoint: S,
+  logoPrimary: j,
+  baseLayout: D,
+  mainContent: R,
+  header: q,
+  headerContent: X,
+  headerItems: A,
+  logo: J,
+  headerMenu: K,
+  toggleButton: Q,
+  sidebar: U,
+  main: V,
+  app: W,
+  sidebarOpened: Y,
+  sidebarHeader: Z,
+  sidebarFooter: ee,
+  sidebarCollapsed: ae,
+  userName: te,
+  abbr: se,
+  userTitle: ne,
+  title: ie,
+  sidebarNav: re,
+  list: oe,
+  listGroupTitle: le,
+  listItem: de,
+  listItemCollapsed: ce,
+  listLink: me,
+  linkText: pe,
+  linkTextCollapsed: _e,
+  listLinkCollapsed: he,
+  collapseButton: be,
+  backdrop: ye,
+  backdropOpened: ue
+}, He = ({
+  items: p,
+  title: r,
+  user: d,
+  app: t,
+  children: i,
+  headerChildren: o,
+  clientSideRouter: c
+}) => {
+  const [m, s] = b.useState(!1), [n, _] = b.useState(!1);
+  return b.useEffect(() => {
+    const u = (w) => {
+      w.key === "Escape" && _(!1);
+    };
+    return window.addEventListener("keydown", u), () => {
+      window.removeEventListener("keydown", u);
+    };
+  }, []), /* @__PURE__ */ l("div", { className: a.baseLayout, children: [
+    /* @__PURE__ */ e(
+      we,
+      {
+        title: r,
+        headerChildren: o,
+        user: d,
+        app: t,
+        isOpened: n,
+        setIsOpened: _,
+        setIsCollapsed: s
+      }
+    ),
+    /* @__PURE__ */ l("div", { className: a.mainContent, children: [
+      /* @__PURE__ */ e(
+        ke,
+        {
+          items: p,
+          app: t,
+          isOpened: n,
+          isCollapsed: m,
+          setIsCollapsed: s,
+          clientSideRouter: c
+        }
+      ),
+      /* @__PURE__ */ e(N, { children: /* @__PURE__ */ e("main", { className: a.main, children: /* @__PURE__ */ e("div", { className: a.app, children: i }) }) }),
+      /* @__PURE__ */ e(
+        "div",
+        {
+          className: h(a.backdrop, n && a.backdropOpened),
+          onClick: () => _(!1),
+          "aria-hidden": !0
+        }
+      )
+    ] })
+  ] });
+}, ke = ({
+  items: p,
+  app: r,
+  isOpened: d,
+  isCollapsed: t,
+  setIsCollapsed: i,
+  clientSideRouter: o
+}) => {
+  const c = () => /* @__PURE__ */ e("div", { className: a.sidebarHeader, children: t ? /* @__PURE__ */ e("p", { className: a.name, children: r.shortName }) : /* @__PURE__ */ e("p", { className: a.abbr, children: r.name }) }), m = ({ group: s }) => /* @__PURE__ */ e("ul", { className: a.list, children: s.items.map((n, _) => /* @__PURE__ */ e(
+    "li",
+    {
+      className: h(
+        a.listItem,
+        t && a.listItemCollapsed
+      ),
+      children: /* @__PURE__ */ e(
+        f,
+        {
+          iconPlacement: "left",
+          href: n.href,
+          icon: n.icon,
+          className: h(
+            a.listLink,
+            t && a.listLinkCollapsed
+          ),
+          variant: "tertiary",
+          children: /* @__PURE__ */ e(
+            "span",
+            {
+              className: h(
+                a.linkText,
+                t && a.linkTextCollapsed
+              ),
+              children: n.title
+            }
+          )
+        }
+      )
+    },
+    "link_" + _
+  )) });
+  return /* @__PURE__ */ l(
+    "aside",
+    {
+      id: "midasMainMenu",
+      className: h(
+        a.sidebar,
+        t && a.sidebarCollapsed,
+        d && a.sidebarOpened
+      ),
+      children: [
+        /* @__PURE__ */ e(c, {}),
+        /* @__PURE__ */ e("nav", { className: a.sidebarNav, children: /* @__PURE__ */ e("ul", { className: a.list, children: p.map((s, n) => /* @__PURE__ */ l("li", { children: [
+          s.title && !t && /* @__PURE__ */ e("p", { className: a.listGroupTitle, children: s.title }),
+          o ? /* @__PURE__ */ e(L, { navigate: o, children: /* @__PURE__ */ e(m, { group: s }) }) : /* @__PURE__ */ e(m, { group: s })
+        ] }, "list_" + n)) }) }),
+        /* @__PURE__ */ e("div", { className: a.sidebarFooter, children: /* @__PURE__ */ e(
+          k,
+          {
+            variant: "tertiary",
+            "aria-label": t ? "Maximera sidomenyn" : "Minimera sidomenyn",
+            onPress: () => i(!t),
+            className: a.collapseButton,
+            children: t ? /* @__PURE__ */ e(M, {}) : /* @__PURE__ */ e(B, {})
+          }
+        ) })
+      ]
+    }
+  );
+}, we = ({
+  title: p,
+  user: r,
+  app: d,
+  headerChildren: t,
+  isOpened: i,
+  setIsOpened: o,
+  setIsCollapsed: c
+}) => /* @__PURE__ */ l(
+  "header",
+  {
+    className: a.header,
+    style: {
+      borderTop: `solid 4px ${d.color ? d.color : v.logoPrimary}`
+    },
+    children: [
+      /* @__PURE__ */ l("div", { className: a.headerContent, children: [
+        /* @__PURE__ */ e(
+          g,
+          {
+            padding: !1,
+            size: "small",
+            className: a.logo
+          }
+        ),
+        i !== void 0 && c && o && /* @__PURE__ */ e(
+          k,
+          {
+            variant: "icon",
+            className: a.toggleButton,
+            "aria-label": i ? "Stäng meny" : "Öppna meny",
+            "aria-controls": "midasMainMenu",
+            onPress: () => {
+              c(!1), o(!i);
+            },
+            children: i ? /* @__PURE__ */ e(
+              T,
+              {
+                size: 20,
+                "aria-hidden": !0
+              }
+            ) : /* @__PURE__ */ e(
+              I,
+              {
+                size: 20,
+                "aria-hidden": !0
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ l("div", { children: [
+          /* @__PURE__ */ e("p", { className: a.userName, children: r.name }),
+          /* @__PURE__ */ e("p", { className: a.userTitle, children: r.title }),
+          /* @__PURE__ */ e("p", { className: a.title, children: p })
+        ] })
+      ] }),
+      /* @__PURE__ */ e("div", { className: a.headerItems, children: t }),
+      /* @__PURE__ */ e("div", { className: a.headerMenu, children: /* @__PURE__ */ e(x, { children: b.Children.map(t, (m) => /* @__PURE__ */ e(C, { children: m })) }) })
+    ]
+  }
+);
+export {
+  we as Header,
+  He as Layout,
+  ke as Sidebar
+};

package/index8.js

@@ -0,0 +1,4 @@
+import { Spinner as n } from "./index75.js";
+export {
+  n as Spinner
+};