@midas-ds/components 1.0.3 → 1.1.0

package/index68.js

@@ -1,85 +1,69 @@
-import { jsx as n, jsxs as l } from "react/jsx-runtime";
-import { $ as y, I as k, a as _ } from "./TextField-DeK_yiK-.js";
-import { T as $ } from "./TextField.module-0-u4LVPp.js";
-import * as E from "react";
-import { c as A } from "./clsx-OuTLNxxd.js";
-import './TextArea.css';const R = '"../theme/tokens.css"', T = '"Inter", sans-serif', W = "#ffdfdf", F = "(max-width: 767px)", I = "#f2f2f2", N = "#e6e6e6", V = "#bfbfbf", j = "#000000", w = "#e62323", B = "#2e7ca5", S = "500", v = "400", D = "#1f1f1f", q = "0 0 0 2px #ffffff, 0 0 0 4px #000000", z = "_textArea_1tbo6_4", G = "_count_1tbo6_40", H = "_countExceeded_1tbo6_48", o = {
-  tokens: R,
-  display: T,
-  signalRed10: W,
-  smBreakpoint: F,
-  gray10: I,
-  gray20: N,
-  gray50: V,
-  black: j,
-  signalRed100: w,
-  blue100: B,
-  mediumWeight: S,
-  regularWeight: v,
-  inputText: D,
-  focus: q,
-  textArea: z,
-  count: G,
-  countExceeded: H
-}, O = ({
-  label: u,
-  description: i,
-  rows: f,
-  maxCharacters: t,
-  errorMessage: d,
-  showCounter: g,
-  validate: r,
-  ...p
-}) => {
-  const [s, m] = E.useState(""), a = (e) => {
-    const c = e.target.value;
-    m(c);
-  }, x = () => t ? /* @__PURE__ */ l(
-    "span",
-    {
-      className: A(
-        o.count,
-        s.length > t && o.countExceeded
-      ),
-      children: [
-        s.length,
-        " / ",
-        t
-      ]
-    }
-  ) : g ? /* @__PURE__ */ n("span", { className: o.count, children: s.length }) : null, h = (e) => {
-    const c = t && e.length > t ? `Du har angett ${e.length - t} tecken för mycket. Fältet är begränsat till ${t} tecken.` : null, b = r ? r(e) : null;
-    return c || b || !0;
-  };
-  return /* @__PURE__ */ n(
-    y,
-    {
-      className: $.inputField,
-      validate: h,
-      ...p,
-      children: /* @__PURE__ */ l(
-        k,
+import { jsxs as o, jsx as s } from "react/jsx-runtime";
+import { Link as _ } from "./index74.js";
+import { c as m } from "./clsx-OuTLNxxd.js";
+import { $ as B } from "./useFocusRing-9PXyKy2A.js";
+import './Card.css';const g = '"../theme/tokens.css"', h = '"Inter", sans-serif', b = "#ffffff", u = "#e6e6e6", k = "#f2f2f2", p = "#1f1f1f", v = "#d5e5ed", x = "#000000", y = "500", j = "250ms", N = "_card_vbecj_4", T = "_content_vbecj_33", w = "_heading_vbecj_39", L = "_image_vbecj_47", W = "_background_vbecj_56", C = "_text_vbecj_60", t = {
+  tokens: g,
+  display: h,
+  white: b,
+  gray20: u,
+  gray10: k,
+  gray150: p,
+  blue20: v,
+  black: x,
+  mediumWeight: y,
+  fastTransition: j,
+  card: N,
+  content: T,
+  heading: w,
+  image: L,
+  background: W,
+  text: C
+}, q = ({
+  image: e,
+  background: a,
+  title: r,
+  content: i,
+  link: d,
+  headingTag: l = "h1",
+  customImageComponent: c,
+  customLinkComponent: f,
+  ...n
+}) => /* @__PURE__ */ o(
+  "div",
+  {
+    className: m(
+      t.card,
+      a && t.background,
+      n.className
+    ),
+    ...n,
+    children: [
+      /* @__PURE__ */ o("div", { className: t.content, children: [
+        c || (e == null ? void 0 : e.source) && /* @__PURE__ */ s(
+          "img",
+          {
+            src: e.source,
+            alt: e.description,
+            className: t.image
+          }
+        ),
+        /* @__PURE__ */ s(l, { className: t.heading, children: r }),
+        /* @__PURE__ */ s("p", { className: t.text, children: i })
+      ] }),
+      /* @__PURE__ */ s(
+        _,
         {
-          label: u,
-          description: i,
-          errorMessage: d,
-          children: [
-            /* @__PURE__ */ n(x, {}),
-            /* @__PURE__ */ n(
-              _,
-              {
-                className: o.textArea,
-                rows: f,
-                onFocus: a,
-                onChange: a
-              }
-            )
-          ]
+          ...d,
+          standalone: !0,
+          stretched: !0,
+          as: f
         }
       )
-    }
-  );
-};
+    ]
+  }
+);
 export {
-  O as TextArea
+  q as Card,
+  B as RouterProvider
 };

package/index69.js

@@ -1,74 +1,80 @@
-import { jsx as c, jsxs as f, Fragment as m } from "react/jsx-runtime";
-import { $ as _ } from "./Button-B4vMZbC6.js";
-import { c as g } from "./clsx-OuTLNxxd.js";
-import './Button.css';const y = '"../theme/tokens.css"', u = "#143c50", b = "#25607f", h = "#4289ad", p = '"Inter", sans-serif', R = "1rem", k = "500", x = "#ffffff", w = "#bfbfbf", B = "#f2f2f2", v = "#e6e6e6", $ = "#000000", z = "undefined", S = "(max-width: 767px)", j = "0 0 0 2px #ffffff, 0 0 0 4px #000000", W = "#e62323", F = "#b31b1b", I = "#801313", N = "_button_1tedv_4", q = "_primary_1tedv_36", A = "_secondary_1tedv_42", D = "_tertiary_1tedv_66", E = "_iconBtn_1tedv_88", G = "_danger_1tedv_109", H = "_iconRight_1tedv_131", J = "_fullwidth_1tedv_135", K = "_small_1tedv_139", t = {
-  tokens: y,
-  blue150: u,
-  blue130: b,
-  blue90: h,
-  display: p,
-  desktopSize: R,
-  mediumWeight: k,
-  white: x,
-  gray50: w,
-  gray10: B,
-  gray20: v,
-  black: $,
-  medium: z,
-  smBreakpoint: S,
-  focus: j,
-  signalRed100: W,
-  signalRed130: F,
-  signalRed150: I,
-  button: N,
-  primary: q,
-  secondary: A,
-  tertiary: D,
-  iconBtn: E,
-  danger: G,
-  iconRight: H,
-  fullwidth: J,
-  small: K
-}, P = ({
-  variant: e = "primary",
-  fullwidth: i,
-  className: r,
-  iconPlacement: d,
-  size: n,
-  icon: s,
-  iconSize: a,
+import { jsxs as e, jsx as s } from "react/jsx-runtime";
+import * as m from "react";
+import { c as _ } from "./clsx-OuTLNxxd.js";
+import { Button as g } from "./index66.js";
+import { X as h } from "./x-JK7i-TQC.js";
+import { C as u, I as p, a as B, T as w } from "./triangle-alert-1OYl9KWz.js";
+import './InfoBanner.css';const b = '"../theme/tokens.css"', x = '"Inter", sans-serif', N = "#d5f2d9", k = "#008d3c", v = "#eaf2f6", I = "#0066cc", R = "#fff8e1", C = "#f1c21b", G = "#ffdfdf", S = "#e62323", Y = "#000000", j = "600", y = "_infoBanner_cn873_4", z = "_success_cn873_12", A = "_info_cn873_4", T = "_important_cn873_22", W = "_warning_cn873_27", $ = "_content_cn873_36", M = "_heading_cn873_42", P = "_text_cn873_47", X = "_icon_cn873_52", q = "_dismissable_cn873_57", n = {
+  tokens: b,
+  display: x,
+  signalGreen10: N,
+  signalGreen100: k,
+  signalBlue10: v,
+  signalBlue100: I,
+  signalYellow10: R,
+  signalYellow100: C,
+  signalRed10: G,
+  signalRed100: S,
+  black: Y,
+  semiBoldWeight: j,
+  infoBanner: y,
+  success: z,
+  info: A,
+  important: T,
+  warning: W,
+  content: $,
+  heading: M,
+  text: P,
+  icon: X,
+  dismissable: q
+}, D = {
+  success: u,
+  info: p,
+  important: B,
+  warning: w
+}, L = ({
+  title: c,
+  message: a,
+  type: i,
+  children: t,
+  dismissable: l = !1,
   ...o
 }) => {
-  const l = n === "small" ? 14 : a || 20;
-  return /* @__PURE__ */ c(
-    _,
+  const r = D[i], [d, f] = m.useState(!0);
+  return d ? /* @__PURE__ */ e(
+    "div",
     {
-      className: g(
-        t.button,
-        e === "primary" && t.primary,
-        e === "secondary" && t.secondary,
-        e === "tertiary" && t.tertiary,
-        e === "danger" && t.danger,
-        e === "icon" && t.iconBtn,
-        i && t.fullwidth,
-        n === "small" && t.small,
-        d === "right" && t.iconRight,
-        r
-      ),
+      className: _(n.infoBanner, n[i], o.className),
       ...o,
-      children: /* @__PURE__ */ f(m, { children: [
-        s && /* @__PURE__ */ c(
-          s,
+      children: [
+        /* @__PURE__ */ s(
+          r,
           {
+            size: 20,
             "aria-hidden": !0,
-            size: l
+            className: n.icon
           }
         ),
-        o.children
-      ] })
+        /* @__PURE__ */ e("div", { className: n.content, children: [
+          c && /* @__PURE__ */ s("strong", { className: n.heading, children: c }),
+          /* @__PURE__ */ e("div", { className: n.text, children: [
+            a,
+            t
+          ] })
+        ] }),
+        l && /* @__PURE__ */ s("div", { className: n.dismissable, children: /* @__PURE__ */ s(
+          g,
+          {
+            variant: "icon",
+            "aria-label": "Stäng",
+            onPress: () => f(!1),
+            children: /* @__PURE__ */ s(h, { size: 20 })
+          }
+        ) })
+      ]
     }
-  );
+  ) : null;
 };
 export {
-  P as Button
+  L as InfoBanner
 };

package/index7.js

@@ -1,4 +1,4 @@
-import { Cell as o, Column as a, Row as b, Table as r, TableBody as T, TableHeader as d } from "./index89.js";
+import { Cell as o, Column as a, Row as b, Table as r, TableBody as T, TableHeader as d } from "./index86.js";
 export {
   o as Cell,
   a as Column,

package/index70.js

@@ -1,24 +1,140 @@
-import { jsx as n } from "react/jsx-runtime";
-import { c as e } from "./clsx-OuTLNxxd.js";
-import './ButtonGroup.css';const p = '"../theme/tokens.css"', a = "(max-width: 767px)", u = "_buttonGroup_5pd8y_4", c = {
-  tokens: p,
-  smBreakpoint: a,
-  buttonGroup: u
-}, l = ({
-  children: o,
-  className: t,
-  "aria-label": s,
-  ...r
-}) => /* @__PURE__ */ n(
-  "div",
-  {
-    role: "group",
-    "aria-label": s,
-    className: e(c.buttonGroup, t),
-    ...r,
-    children: o
-  }
-);
+import { jsx as c, jsxs as t } from "react/jsx-runtime";
+import { c as o } from "./clsx-OuTLNxxd.js";
+import './Logo.css';const v = '"../theme/tokens.css"', i = "#b90835", m = "#000000", g = "#5d5d5d", _ = "#ffffff", p = "_container_1c334_4", M = "_noPadding_1c334_9", u = "_logo_1c334_13", Z = "_primary_1c334_18", f = "_dark_1c334_22", k = "_xSmall_1c334_26", b = "_small_1c334_30", x = "_large_1c334_34", w = "_backgroundPrimary_1c334_38", y = "_backgroundDark_1c334_46", l = {
+  tokens: v,
+  red100: i,
+  black: m,
+  gray130: g,
+  white: _,
+  container: p,
+  noPadding: M,
+  logo: u,
+  primary: Z,
+  dark: f,
+  xSmall: k,
+  small: b,
+  large: x,
+  backgroundPrimary: w,
+  backgroundDark: y
+}, S = ({
+  primary: h = !0,
+  size: a = "medium",
+  background: d = !1,
+  padding: r = !0,
+  ...s
+}) => {
+  const e = o(
+    l.logo,
+    h ? l.primary : l.dark,
+    a === "x-small" && l.xSmall,
+    a === "small" && l.small,
+    a === "medium" && l.medium,
+    a === "large" && l.large
+  ), n = () => a === "x-small" ? /* @__PURE__ */ c(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 100 92",
+      className: e,
+      role: "img",
+      "aria-hidden": "false",
+      focusable: "false",
+      "aria-label": "Migrationsverkets logotyp",
+      children: /* @__PURE__ */ c("path", { d: "M99.99,91.69c-1.84-1.11-4.05-4.55-4.05-9.46V9.15c0-4.79,1.96-7.25,3.81-8.85h-14.75l-33.91,65.47L12.41.3H0c1.6,1.59,3.93,3.07,3.93,8.23v75.55c0,3.56-2.21,6.51-3.81,7.61h16.34c-1.72-1.22-3.93-4.18-3.93-7.98V25.97l36.24,61.42,33.04-63.26v58.96c0,5.53-2.21,7.61-3.81,8.6h21.99Z" })
+    }
+  ) : /* @__PURE__ */ t(
+    "svg",
+    {
+      role: "img",
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 112 40",
+      className: e,
+      "aria-hidden": "false",
+      focusable: "false",
+      "aria-label": "Migrationsverkets logotyp",
+      children: [
+        /* @__PURE__ */ c("path", { d: "M97.78,21.61c-7.48-9.73-20.06-16.03-34.32-16.03-13.07,0-24.86,5.27-32.46,13.65,6.56-5.83,15.64-9.44,25.66-9.44,11.37,0,21.52,4.56,28.18,11.83h12.94Z" }),
+        /* @__PURE__ */ c("path", { d: "M90.45,12.58C70.67-1.51,41.26,2.77,27.49,21.61h-12.23C30.56-2.89,68.29-7.47,90.45,12.58h0Z" }),
+        /* @__PURE__ */ c("path", { d: "M11.89,37.13c-.22-.13-.48-.53-.48-1.11v-8.58c0-.56.23-.85.45-1.04h-1.73l-3.98,7.69-4.54-7.69H.15c.19.19.46.36.46.97v8.87c0,.42-.26.76-.45.89h1.92c-.2-.14-.46-.49-.46-.94v-6.78l4.25,7.21,3.88-7.43v6.92c0,.65-.26.89-.45,1.01h2.58Z" }),
+        /* @__PURE__ */ c(
+          "path",
+          {
+            d: "M15.81,26.86c0-.45-.36-.81-.81-.81s-.81.36-.81.81.36.81.81.81.81-.36.81-.81h0ZM16.22,37.13c-.3-.23-.45-.5-.45-1.07v-6.4h-1.98c.37.19.49.58.49,1.17v5.23c0,.48-.09.79-.46,1.07h2.39Z",
+            fillRule: "evenodd"
+          }
+        ),
+        /* @__PURE__ */ c(
+          "path",
+          {
+            d: "M24.52,30.97c-.04-.33-.17-.68-.37-.95h-1.36c-.29-.26-.87-.58-1.96-.58-1.53,0-2.8.92-2.8,2.58,0,1.02.52,1.86,1.31,2.26-.43.37-1.38.98-1.38,1.61,0,.71.79.99,1.38,1.1-.88.26-1.67.82-1.67,1.59,0,1.14,1.73,1.41,2.64,1.41,1.54,0,3.91-.78,3.91-2.64,0-1.21-1.23-1.49-2.22-1.5-2.42-.06-2.51-.2-2.51-.56,0-.2.42-.68.55-.81.23.03.48.06.71.06,1.76,0,2.93-.94,2.93-2.7,0-.48-.14-.91-.29-1.11.12-.04.25-.04.37-.04.27,0,.55.12.76.27h0ZM22.27,32.21c0,.79-.37,1.61-1.36,1.61-1.07,0-1.47-1.21-1.47-2.09,0-.95.5-1.57,1.31-1.57,1.2,0,1.51,1.25,1.51,2.05h0ZM22.89,37.92c0,.76-.82,1.31-1.93,1.31-.59,0-1.7-.3-1.69-1.15,0-.45.26-.74.59-.99l1.96.04c.5.01,1.07.1,1.07.79h0Z",
+            fillRule: "evenodd"
+          }
+        ),
+        /* @__PURE__ */ c("path", { d: "M30.11,31.22l-.23-1.63c-.2-.1-.43-.14-.65-.14-.85,0-1.46.68-1.79,1.37v-1.15h-1.96c.45.27.48.76.48,1.14v5.19c0,.58-.1.89-.45,1.14h2.35c-.36-.29-.42-.63-.42-1.12v-4.27c.22-.58.78-1.04,1.43-1.04.46,0,.97.26,1.24.52h0Z" }),
+        /* @__PURE__ */ c(
+          "path",
+          {
+            d: "M36.87,37.13c-.37-.33-.43-.59-.43-1.25v-3.89c0-2.21-1.43-2.55-2.8-2.55-.61,0-1.67.22-2.03.42-.2.4-.3,1.24-.4,1.67.46-.56,1.27-1.37,2.39-1.37,1.18,0,1.36.82,1.36,1.7v.39l-2.21.76c-1.04.36-1.87,1.08-1.87,2.26,0,1.31.88,2.08,2.15,2.08.87,0,1.46-.43,1.93-.94v.72h1.92ZM34.95,35.62c-.26.32-.74.85-1.37.85-.75,0-1.18-.79-1.18-1.54,0-.71.35-1.15.89-1.37l1.66-.63v2.7h0Z",
+            fillRule: "evenodd"
+          }
+        ),
+        /* @__PURE__ */ c("path", { d: "M42.58,36.15c-.29.27-.71.46-1.11.46-.87,0-1.07-.98-1.07-1.66v-4.51h.85c.43,0,.94.13,1.33.35l-.17-1.12h-2v-1.76c-.68.95-1.54,1.96-2.58,2.54h1.1v4.43c0,1.43.32,2.47,1.95,2.47.48,0,.98-.1,1.38-.36.14-.25.25-.55.33-.82h0Z" }),
+        /* @__PURE__ */ c(
+          "path",
+          {
+            d: "M45.63,26.86c0-.45-.36-.81-.81-.81s-.81.36-.81.81.36.81.81.81.81-.36.81-.81h0ZM46.04,37.13c-.3-.23-.45-.5-.45-1.07v-6.4h-1.98c.37.19.49.58.49,1.17v5.23c0,.48-.09.79-.46,1.07h2.39Z",
+            fillRule: "evenodd"
+          }
+        ),
+        /* @__PURE__ */ c(
+          "path",
+          {
+            d: "M54.96,33.37c0-2.06-1.3-3.95-3.5-3.95s-3.84,1.76-3.84,4.01c0,2.06,1.28,3.95,3.49,3.95s3.85-1.76,3.85-4.01h0ZM53.43,34.04c0,1.27-.52,2.57-1.86,2.57-1.79,0-2.42-2.44-2.42-3.86,0-1.21.48-2.57,1.87-2.57,1.79,0,2.41,2.44,2.41,3.86h0Z",
+            fillRule: "evenodd"
+          }
+        ),
+        /* @__PURE__ */ c("path", { d: "M63.37,37.13c-.27-.22-.45-.42-.45-1.11v-3.94c0-1.63-.39-2.64-2.18-2.64-1.01,0-1.79.56-2.38,1.12v-.91h-1.98c.3.17.49.46.49,1.05v5.33c0,.59-.14.88-.48,1.08h2.39c-.23-.23-.43-.37-.43-1.17v-4.4c.32-.45,1.07-1.24,1.85-1.24,1.01,0,1.23,1.01,1.23,1.8v3.95c0,.74-.26.87-.46,1.05h2.39Z" }),
+        /* @__PURE__ */ c(
+          "path",
+          {
+            d: "M69.79,35.2c0-2.21-3.42-2.71-3.42-4.07,0-.75.71-.98,1.34-.98s1.33.29,1.74.81l-.07-1.18c-.46-.17-1.11-.35-1.69-.35-1.44,0-2.68.63-2.68,1.89,0,2.36,3.46,2.68,3.46,4.25,0,.79-.62,1.05-1.31,1.05-1.01,0-1.86-.46-2.52-1.21v.1c0,.4-.03.99.3,1.27.53.43,1.53.56,2.18.56,1.36,0,2.67-.62,2.67-2.15h0Z",
+            fillRule: "evenodd"
+          }
+        ),
+        /* @__PURE__ */ c("path", { d: "M77.98,29.66h-1.43c.13.1.11.56-.19,1.33l-1.86,4.72-1.87-4.7c-.26-.65-.32-1.15-.16-1.34h-2.06c.19.1.49.85.82,1.67l2.31,5.8h1.31l2.35-5.97c.32-.81.56-1.36.78-1.5h0Z" }),
+        /* @__PURE__ */ c(
+          "path",
+          {
+            d: "M84.91,33.54v-.23c0-1.92-.62-3.88-2.88-3.88s-3.56,2.02-3.56,4.11,1.41,3.81,3.58,3.81c.78,0,1.62-.17,2.13-.45.32-.35.49-.79.59-1.27-.69.5-1.41.84-2.31.84-1.49,0-2.35-1.57-2.38-2.88l4.83-.04h0ZM83.34,32.88c-1.1.09-2.16.1-3.27.1.01-.78.29-2.83,1.7-2.83,1.33,0,1.57,1.72,1.57,2.73h0Z",
+            fillRule: "evenodd"
+          }
+        ),
+        /* @__PURE__ */ c("path", { d: "M90.95,31.22l-.23-1.63c-.2-.1-.43-.14-.65-.14-.85,0-1.46.68-1.79,1.37v-1.15h-1.96c.45.27.48.76.48,1.14v5.19c0,.58-.1.89-.45,1.14h2.35c-.36-.29-.42-.63-.42-1.12v-4.27c.22-.58.78-1.04,1.43-1.04.46,0,.97.26,1.24.52h0Z" }),
+        /* @__PURE__ */ c("path", { d: "M99.79,37.16c-2.26-.37-2.49-4.04-4.7-4.04l2.62-2.8c.22-.23.5-.48.75-.66h-1.77c.14.14.13.39-.13.66l-2.65,2.83v-7.07h-1.98c.33.2.49.56.49,1.01v9.01c0,.58-.22.81-.46,1.02h2.35c-.26-.25-.4-.49-.4-1.02v-2.57c.27,0,.62.13.82.26,1.28.82,1.95,3.11,2.67,3.45.14.07.94.1,1.14.1.45,0,.84-.03,1.25-.19h0Z" }),
+        /* @__PURE__ */ c(
+          "path",
+          {
+            d: "M106.3,33.54v-.23c0-1.92-.62-3.88-2.88-3.88s-3.56,2.02-3.56,4.11,1.41,3.81,3.58,3.81c.78,0,1.62-.17,2.13-.45.32-.35.49-.79.59-1.27-.69.5-1.41.84-2.31.84-1.49,0-2.35-1.57-2.38-2.88l4.83-.04h0ZM104.73,32.88c-1.1.09-2.16.1-3.27.1.01-.78.29-2.83,1.7-2.83,1.33,0,1.57,1.72,1.57,2.73h0Z",
+            fillRule: "evenodd"
+          }
+        ),
+        /* @__PURE__ */ c("path", { d: "M111.85,36.15c-.29.27-.71.46-1.11.46-.86,0-1.07-.98-1.07-1.66v-4.51h.85c.43,0,.94.13,1.33.35l-.17-1.12h-2v-1.76c-.68.95-1.54,1.96-2.58,2.54h1.1v4.43c0,1.43.32,2.47,1.95,2.47.48,0,.98-.1,1.38-.36.14-.25.25-.55.33-.82h0Z" })
+      ]
+    }
+  );
+  return /* @__PURE__ */ c(
+    "div",
+    {
+      className: o(
+        l.container,
+        r === !1 && l.noPadding,
+        d ? h ? l.backgroundPrimary : l.backgroundDark : null
+      ),
+      ...s,
+      children: /* @__PURE__ */ c(n, {})
+    }
+  );
+};
 export {
-  l as ButtonGroup
+  S as Logo
 };

package/index71.js

@@ -1,69 +1,70 @@
-import { jsxs as o, jsx as s } from "react/jsx-runtime";
-import { Link as _ } from "./index77.js";
-import { c as m } from "./clsx-OuTLNxxd.js";
-import { $ as B } from "./useFocusRing-BKGhL91C.js";
-import './Card.css';const g = '"../theme/tokens.css"', h = '"Inter", sans-serif', b = "#ffffff", u = "#e6e6e6", k = "#f2f2f2", p = "#1f1f1f", v = "#d5e5ed", x = "#000000", y = "500", j = "250ms", N = "_card_vbecj_4", T = "_content_vbecj_33", w = "_heading_vbecj_39", L = "_image_vbecj_47", W = "_background_vbecj_56", C = "_text_vbecj_60", t = {
-  tokens: g,
-  display: h,
-  white: b,
-  gray20: u,
-  gray10: k,
-  gray150: p,
-  blue20: v,
-  black: x,
-  mediumWeight: y,
-  fastTransition: j,
-  card: N,
-  content: T,
-  heading: w,
-  image: L,
-  background: W,
-  text: C
-}, q = ({
-  image: e,
-  background: a,
-  title: r,
-  content: i,
-  link: d,
-  headingTag: l = "h1",
-  customImageComponent: c,
-  customLinkComponent: f,
-  ...n
-}) => /* @__PURE__ */ o(
-  "div",
-  {
-    className: m(
-      t.card,
-      a && t.background,
-      n.className
-    ),
-    ...n,
-    children: [
-      /* @__PURE__ */ o("div", { className: t.content, children: [
-        c || (e == null ? void 0 : e.source) && /* @__PURE__ */ s(
-          "img",
+import { jsxs as c, jsx as s } from "react/jsx-runtime";
+import * as m from "react";
+import { Button as g } from "./index66.js";
+import { c as u } from "./clsx-OuTLNxxd.js";
+import { X as H } from "./x-JK7i-TQC.js";
+import './Modal.css';const w = '"../theme/tokens.css"', p = '"Inter", sans-serif', B = "#ffffff", q = "#f2f2f2", x = "_modal_1wq00_4", N = "_modalHeader_1wq00_30", b = "_modalBody_1wq00_39", k = "_modalHeading_1wq00_45", e = {
+  tokens: w,
+  display: p,
+  white: B,
+  gray10: q,
+  modal: x,
+  modalHeader: N,
+  modalBody: b,
+  modalHeading: k
+}, P = ({
+  id: d,
+  isOpen: l,
+  onOpenChange: t,
+  children: i,
+  title: f,
+  className: h,
+  ..._
+}) => {
+  const a = m.useRef(null);
+  m.useEffect(() => {
+    var o, r;
+    l ? (o = a.current) == null || o.showModal() : (r = a.current) == null || r.close();
+  }, [l]);
+  const y = () => {
+    var o;
+    (o = a.current) == null || o.close(), t(!1);
+  }, n = d + "_heading";
+  return /* @__PURE__ */ c(
+    "dialog",
+    {
+      id: d,
+      ref: a,
+      onCancel: () => t(!1),
+      className: u(e.modal, h),
+      "aria-labelledby": n,
+      ..._,
+      children: [
+        /* @__PURE__ */ s("div", { className: e.modalHeader, children: /* @__PURE__ */ s(
+          g,
           {
-            src: e.source,
-            alt: e.description,
-            className: t.image
+            onPress: () => y(),
+            variant: "tertiary",
+            icon: H,
+            iconPlacement: "right",
+            children: "Stäng"
           }
-        ),
-        /* @__PURE__ */ s(l, { className: t.heading, children: r }),
-        /* @__PURE__ */ s("p", { className: t.text, children: i })
-      ] }),
-      /* @__PURE__ */ s(
-        _,
-        {
-          ...d,
-          standalone: !0,
-          stretched: !0,
-          as: f
-        }
-      )
-    ]
-  }
-);
+        ) }),
+        /* @__PURE__ */ c("div", { className: e.modalBody, children: [
+          /* @__PURE__ */ s(
+            "h2",
+            {
+              className: e.modalHeading,
+              id: n,
+              children: f
+            }
+          ),
+          i
+        ] })
+      ]
+    }
+  );
+};
 export {
-  q as Card,
-  B as RouterProvider
+  P as Modal
 };