@altinn/altinn-components 0.56.34 → 0.57.3

package/dist/components/Dropdown/Dropdown.js

@@ -1,176 +1,10 @@
-import { jsxs as x, jsx as a, Fragment as M } from "react/jsx-runtime";
-import { c as O } from "../../index-p1eeF8LQ.js";
-import { useRef as R, useEffect as D, useState as $, useCallback as G, useLayoutEffect as J } from "react";
-import { createPortal as Q } from "react-dom";
-import { Button as H } from "../Button/Button.js";
-import "../RootProvider/RootProvider.js";
+import "react/jsx-runtime";
+import "../../index-p1eeF8LQ.js";
+import "react";
+import "react-dom";
+import "../Button/Button.js";
+import { g as e } from "../../Section-xbt3ft20.js";
 import "../Snackbar/useSnackbar.js";
-import { S as V } from "../../XMark-tKk6aExO.js";
-import '../../assets/Dropdown.css';const Z = "_dropdown_1mtdm_1", P = "_content_1mtdm_17", tt = "_backdrop_1mtdm_47", et = "_header_1mtdm_76", rt = "_footer_1mtdm_77", nt = "_title_1mtdm_148", m = {
-  dropdown: Z,
-  content: P,
-  backdrop: tt,
-  header: et,
-  footer: rt,
-  title: nt
-}, ot = "data-focus-guard", z = (h) => {
-  const v = [
-    "a[href]",
-    "button:not([disabled])",
-    "input:not([disabled])",
-    "select:not([disabled])",
-    "textarea:not([disabled])",
-    '[tabindex]:not([tabindex="-1"])',
-    '[contenteditable="true"]'
-  ].join(",");
-  return Array.from(h.querySelectorAll(v)).filter((c) => !c.hasAttribute(ot)).filter((c) => !c.hasAttribute("disabled")).filter((c) => c.getAttribute("aria-hidden") !== "true").filter((c) => c.tabIndex !== -1).filter((c) => {
-    const p = c.getClientRects();
-    return p.length > 0 && p[0].width > 0 && p[0].height > 0;
-  });
-}, it = (h) => {
-  z(h)[0]?.focus({ preventScroll: !0 });
-}, pt = ({
-  id: h = "dropdown",
-  size: v = "sm",
-  className: c,
-  backdrop: p = !0,
-  placement: _ = "bottom-left",
-  variant: E = "dropdown",
-  title: C = "Title",
-  closeLabel: F = "Close",
-  submitLabel: k,
-  trigger: N,
-  children: B,
-  open: r,
-  onClose: g,
-  onSubmit: I,
-  activeDescendantId: T,
-  useFixedPosition: l = !1,
-  expanded: X = !1
-}) => {
-  const b = R(null), u = R(null), S = R(r);
-  D(() => {
-    S.current = r;
-  }, [r]);
-  const [n, Y] = $({
-    yDir: _.includes("top") ? "top" : "bottom",
-    xDir: _.includes("right") ? "right" : "left",
-    maxHeight: 300
-  }), f = G(() => {
-    if (r && b.current && u.current) {
-      const t = b.current.getBoundingClientRect(), d = u.current.getBoundingClientRect(), o = window.innerHeight, e = window.innerWidth, i = 16, s = o - t.bottom, w = t.top, y = e - t.right - d.width, A = s < 250 && w > s, q = A ? "top" : "bottom", K = (A ? w : s) - i, U = y < i ? "right" : "left";
-      Y((W) => ({
-        ...W,
-        yDir: q,
-        maxHeight: K,
-        xDir: U,
-        triggerRect: l ? t : void 0
-      }));
-    }
-  }, [r, l]);
-  J(() => (f(), window.addEventListener("resize", f), l && window.addEventListener("scroll", f, !0), () => {
-    window.removeEventListener("resize", f), l && window.removeEventListener("scroll", f, !0);
-  }), [f, l]), D(() => {
-    if (!r) return;
-    const t = requestAnimationFrame(() => {
-      const d = u.current;
-      if (!d) return;
-      const o = d.querySelector(
-        'input[type="search"]:not([disabled]), input[role="searchbox"]:not([disabled]), input[data-dropdown-search]:not([disabled])'
-      );
-      if (o) {
-        const e = o.value.length;
-        o.focus({ preventScroll: !0 });
-        try {
-          o.setSelectionRange(e, e);
-        } catch {
-        }
-        return;
-      }
-      d.focus?.({ preventScroll: !0 });
-    });
-    return () => cancelAnimationFrame(t);
-  }, [r]), D(() => {
-    const t = (o) => {
-      o.key === "Escape" && g();
-    }, d = (o) => {
-      const e = o.target, i = b.current?.contains(e), s = u.current?.contains(e);
-      !i && !s && g();
-    };
-    return r && (document.addEventListener("mousedown", d), document.addEventListener("keydown", t)), () => {
-      document.removeEventListener("mousedown", d), document.removeEventListener("keydown", t);
-    };
-  }, [r, g]), D(() => {
-    if (!r) return;
-    const t = u.current;
-    if (!t) return;
-    const d = (e) => {
-      if (!S.current)
-        return;
-      const i = e.target;
-      i && !t.contains(i) && it(t);
-    }, o = (e) => {
-      if (e.key !== "Tab") return;
-      const i = z(t);
-      if (i.length === 0) {
-        e.preventDefault(), t.focus?.({ preventScroll: !0 });
-        return;
-      }
-      const s = i[0], w = i[i.length - 1], y = document.activeElement;
-      e.shiftKey ? y === s && (e.preventDefault(), w.focus({ preventScroll: !0 })) : y === w && (e.preventDefault(), s.focus({ preventScroll: !0 }));
-    };
-    return document.addEventListener("focusin", d), document.addEventListener("keydown", o), () => {
-      document.removeEventListener("focusin", d), document.removeEventListener("keydown", o);
-    };
-  }, [r]);
-  const j = l && n.triggerRect ? {
-    position: "fixed",
-    zIndex: 1e3,
-    width: "max-content",
-    maxHeight: `${n.maxHeight}px`,
-    overflowY: "auto",
-    [n.xDir === "left" ? "left" : "right"]: n.xDir === "left" ? n.triggerRect.left : window.innerWidth - n.triggerRect.right,
-    [n.yDir === "bottom" ? "top" : "bottom"]: n.yDir === "bottom" ? n.triggerRect.bottom + 8 : window.innerHeight - n.triggerRect.top + 8
-  } : {
-    position: "absolute",
-    zIndex: 50,
-    width: "max-content",
-    maxHeight: `${n.maxHeight}px`,
-    overflowY: "auto",
-    [n.xDir]: 0,
-    [n.yDir === "bottom" ? "top" : "bottom"]: "100%"
-  }, L = /* @__PURE__ */ x(
-    "div",
-    {
-      ref: u,
-      className: O(m.dropdown, c),
-      style: j,
-      "aria-hidden": !r,
-      "data-variant": E,
-      "data-expanded": X,
-      "data-size": v,
-      tabIndex: -1,
-      role: "menu",
-      "aria-modal": E === "drawer-dropdown" ? !0 : void 0,
-      "aria-activedescendant": T,
-      children: [
-        /* @__PURE__ */ x("header", { className: m.header, children: [
-          /* @__PURE__ */ a("h2", { className: m.title, children: C }),
-          /* @__PURE__ */ a(H, { size: "sm", variant: "outline", onClick: g, "aria-label": F, children: /* @__PURE__ */ a(V, {}) })
-        ] }),
-        /* @__PURE__ */ a("div", { className: m.content, children: B }),
-        k && /* @__PURE__ */ a("footer", { className: m.footer, children: /* @__PURE__ */ a(H, { size: "lg", variant: "solid", onClick: I || g, rounded: !0, children: /* @__PURE__ */ a("span", { "data-size": "md", children: k }) }) })
-      ]
-    }
-  );
-  return /* @__PURE__ */ x(M, { children: [
-    p && /* @__PURE__ */ a("div", { className: m.backdrop, "aria-hidden": !r }),
-    /* @__PURE__ */ x("div", { id: h + "-root", ref: b, style: { position: "relative", display: "inline-block" }, children: [
-      N,
-      l ? Q(L, document.body) : L
-    ] })
-  ] });
-};
 export {
-  pt as Dropdown
+  e as Dropdown
 };

package/dist/components/Dropdown/DropdownBase.js

@@ -2,7 +2,7 @@ import { jsx as i } from "react/jsx-runtime";
 import { c } from "../../index-p1eeF8LQ.js";
 import { useRef as f } from "react";
 import { useClickOutside as l } from "../../hooks/useClickOutside.js";
-import "../RootProvider/RootProvider.js";
+import "../../Section-xbt3ft20.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";

package/dist/components/Dropdown/FloatingDropdown.js

@@ -4,8 +4,7 @@ import { useRef as u, useEffect as d } from "react";
 import { useClickOutside as z } from "../../hooks/useClickOutside.js";
 import { useMenu as B } from "../../hooks/useMenu.js";
 import "../../index-p1eeF8LQ.js";
-import { Icon as O } from "../Icon/Icon.js";
-import { useRootContext as $ } from "../RootProvider/RootProvider.js";
+import { x as O, I as $ } from "../../Section-xbt3ft20.js";
 import { Button as D } from "../Button/Button.js";
 import { ButtonIcon as G } from "../Button/ButtonIcon.js";
 import "react-dom";
@@ -16,7 +15,7 @@ import '../../assets/FloatingDropdown.css';const H = "_container_dqumv_1", J = "
   dropdown: P,
   dropdownItem: Q,
   itemTitle: U
-}, ct = ({
+}, st = ({
   variant: F = "solid",
   size: C,
   icon: L,
@@ -28,9 +27,9 @@ import '../../assets/FloatingDropdown.css';const H = "_container_dqumv_1", J = "
   items: A,
   "data-testid": M
 }) => {
-  const { currentId: N, toggleId: l } = $(), t = N === a, b = u(t), f = u(null), m = u(null), w = u(null), T = (e) => (n) => {
-    e(n), l(a);
-  }, { menu: K, setActiveIndex: g, activeIndex: _ } = B({
+  const { currentId: N, toggleId: l } = O(), t = N === a, b = u(t), f = u(null), m = u(null), w = u(null), T = (e) => (o) => {
+    e(o), l(a);
+  }, { menu: K, setActiveIndex: g, activeIndex: I } = B({
     items: A,
     groups: { ungrouped: {} },
     keyboardEvents: t,
@@ -51,30 +50,30 @@ import '../../assets/FloatingDropdown.css';const H = "_container_dqumv_1", J = "
     if (!t) return;
     const e = m.current;
     if (!e) return;
-    const n = () => Array.from(e.querySelectorAll('button:not([disabled]), [tabindex]:not([tabindex="-1"])')).filter(
-      (o) => o.tabIndex !== -1
+    const o = () => Array.from(e.querySelectorAll('button:not([disabled]), [tabindex]:not([tabindex="-1"])')).filter(
+      (n) => n.tabIndex !== -1
     ), s = () => {
-      n()[0]?.focus({ preventScroll: !0 });
-    }, y = (o) => {
-      const r = o.target;
+      o()[0]?.focus({ preventScroll: !0 });
+    }, x = (n) => {
+      const r = n.target;
       r && !e.contains(r) && s();
-    }, h = (o) => {
-      if (o.key !== "Tab") return;
-      const r = n();
+    }, y = (n) => {
+      if (n.key !== "Tab") return;
+      const r = o();
       if (r.length === 0) {
-        o.preventDefault(), e.focus({ preventScroll: !0 });
+        n.preventDefault(), e.focus({ preventScroll: !0 });
         return;
       }
-      const x = r[0], E = r[r.length - 1], k = document.activeElement;
-      o.shiftKey && k === x ? (o.preventDefault(), E.focus({ preventScroll: !0 })) : !o.shiftKey && k === E && (o.preventDefault(), x.focus({ preventScroll: !0 }));
+      const h = r[0], E = r[r.length - 1], k = document.activeElement;
+      n.shiftKey && k === h ? (n.preventDefault(), E.focus({ preventScroll: !0 })) : !n.shiftKey && k === E && (n.preventDefault(), h.focus({ preventScroll: !0 }));
     };
-    return document.addEventListener("focusin", y), document.addEventListener("keydown", h), () => {
-      document.removeEventListener("focusin", y), document.removeEventListener("keydown", h);
+    return document.addEventListener("focusin", x), document.addEventListener("keydown", y), () => {
+      document.removeEventListener("focusin", x), document.removeEventListener("keydown", y);
     };
   }, [t]), z(f, () => {
     t && l(a);
   });
-  const I = t && p ? p : L, j = t && _ >= 0 ? `floating-dropdown-button-${_}` : void 0;
+  const _ = t && p ? p : L, j = t && I >= 0 ? `floating-dropdown-button-${I}` : void 0;
   return /* @__PURE__ */ q("div", { className: i.container, ref: f, children: [
     t && /* @__PURE__ */ c(
       "div",
@@ -87,12 +86,12 @@ import '../../assets/FloatingDropdown.css';const H = "_container_dqumv_1", J = "
         "aria-activedescendant": j,
         tabIndex: -1,
         ref: m,
-        children: K[0]?.items.map((e, n) => {
+        children: K[0]?.items.map((e, o) => {
           const s = e.props;
           return /* @__PURE__ */ q(
             D,
             {
-              id: "floating-dropdown-button-" + n,
+              id: "floating-dropdown-button-" + o,
               className: i.dropdownItem,
               onClick: T(s.onClick),
               type: "button",
@@ -102,11 +101,11 @@ import '../../assets/FloatingDropdown.css';const H = "_container_dqumv_1", J = "
               onMouseEnter: e.onMouseEnter,
               onMouseLeave: e.onMouseLeave,
               children: [
-                /* @__PURE__ */ c(O, { svgElement: s.icon, size: "md", color: "inherit" }),
+                /* @__PURE__ */ c($, { svgElement: s.icon, size: "md", color: "inherit" }),
                 /* @__PURE__ */ c("span", { className: i.itemTitle, children: s.title })
               ]
             },
-            n
+            o
           );
         })
       }
@@ -127,11 +126,11 @@ import '../../assets/FloatingDropdown.css';const H = "_container_dqumv_1", J = "
         ref: w,
         autoFocus: !1,
         "aria-controls": t ? "floating-dropdown-menu" : void 0,
-        children: I && /* @__PURE__ */ c(G, { icon: I, size: R })
+        children: _ && /* @__PURE__ */ c(G, { icon: _, size: R })
       }
     )
   ] });
 };
 export {
-  ct as FloatingDropdown
+  st as FloatingDropdown
 };

package/dist/components/Dropdown/index.js

@@ -1,17 +1,17 @@
 import { DropdownBase as e } from "./DropdownBase.js";
-import { Dropdown as t } from "./Dropdown.js";
+import { g as t } from "../../Section-xbt3ft20.js";
 import { Backdrop as f } from "./Backdrop.js";
 import { DrawerBase as w } from "./DrawerBase.js";
 import { DrawerHeader as D } from "./DrawerHeader.js";
 import { DrawerFooter as n } from "./DrawerFooter.js";
 import { DrawerButton as s } from "./DrawerButton.js";
-import { DrawerBody as c } from "./DrawerBody.js";
+import { DrawerBody as F } from "./DrawerBody.js";
 import { DrawerOrDropdown as i } from "./DrawerOrDropdown.js";
 import { FloatingDropdown as l } from "./FloatingDropdown.js";
 export {
   f as Backdrop,
   w as DrawerBase,
-  c as DrawerBody,
+  F as DrawerBody,
   s as DrawerButton,
   n as DrawerFooter,
   D as DrawerHeader,

package/dist/components/Forms/Checkbox.js

@@ -4,7 +4,7 @@ import "react";
 import { Field as e } from "./Field.js";
 import { Label as c } from "./Label.js";
 import { Input as n } from "./Input.js";
-import "../RootProvider/RootProvider.js";
+import "../../Section-xbt3ft20.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";

package/dist/components/Forms/CheckboxOptions.js

@@ -2,7 +2,7 @@ import { jsx as o } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import { Checkbox as i } from "./Checkbox.js";
-import "../RootProvider/RootProvider.js";
+import "../../Section-xbt3ft20.js";
 import { OptionsBase as e } from "./OptionsBase.js";
 import "../Button/Button.js";
 import "react-dom";

package/dist/components/Forms/FieldBase.js

@@ -1,18 +1,13 @@
-import { jsxs as d, jsx as m } from "react/jsx-runtime";
+import "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
-import { Field as e } from "./Field.js";
-import { Label as n } from "./Label.js";
-import "../RootProvider/RootProvider.js";
-import { Typography as c } from "../Typography/Typography.js";
+import "./Field.js";
+import "./Label.js";
+import { F as f } from "../../Section-xbt3ft20.js";
+import "../Typography/Typography.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";
-const B = ({ size: r, color: p, label: o, helperText: i, children: t, ...s }) => /* @__PURE__ */ d(e, { size: r, color: p, ...s, children: [
-  o && /* @__PURE__ */ m(n, { size: r, children: o }),
-  t,
-  i && /* @__PURE__ */ m(c, { size: "xs", children: i })
-] });
 export {
-  B as FieldBase
+  f as FieldBase
 };

package/dist/components/Forms/FieldsetBase.js

@@ -3,7 +3,7 @@ import "../../index-p1eeF8LQ.js";
 import "react";
 import { Fieldset as p } from "./Fieldset.js";
 import { Legend as e } from "./Legend.js";
-import "../RootProvider/RootProvider.js";
+import "../../Section-xbt3ft20.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";

package/dist/components/Forms/Radio.js

@@ -4,7 +4,7 @@ import "react";
 import { Field as e } from "./Field.js";
 import { Label as d } from "./Label.js";
 import { Input as n } from "./Input.js";
-import "../RootProvider/RootProvider.js";
+import "../../Section-xbt3ft20.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";

package/dist/components/Forms/RadioOptions.js

@@ -2,7 +2,7 @@ import { jsx as r } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import { Radio as a } from "./Radio.js";
-import "../RootProvider/RootProvider.js";
+import "../../Section-xbt3ft20.js";
 import { OptionsBase as e } from "./OptionsBase.js";
 import "../Button/Button.js";
 import "react-dom";

package/dist/components/Forms/SearchField.js

@@ -2,15 +2,11 @@ import "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import "./Input.js";
-import "./FieldBase.js";
-import { S as s } from "../../SearchField-BU7Imhpe.js";
-import "../RootProvider/RootProvider.js";
+import { z as f } from "../../Section-xbt3ft20.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";
 import "../Icon/TypingIcon.js";
-import "../../MagnifyingGlass-bwVhw07z.js";
-import "../../XMark-tKk6aExO.js";
 export {
-  s as SearchField
+  f as SearchField
 };

package/dist/components/Forms/SelectField.js

@@ -1,13 +1,12 @@
 import { jsx as o } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
-import { Select as p } from "./Select.js";
-import { FieldBase as e } from "./FieldBase.js";
-import "../RootProvider/RootProvider.js";
+import { Select as e } from "./Select.js";
+import { F as p } from "../../Section-xbt3ft20.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";
-const a = ({ size: r = "md", label: t, children: m, ...i }) => /* @__PURE__ */ o(e, { label: t, size: r, children: /* @__PURE__ */ o(p, { ...i, size: r, children: m }) });
+const x = ({ size: r = "md", label: t, children: m, ...i }) => /* @__PURE__ */ o(p, { label: t, size: r, children: /* @__PURE__ */ o(e, { ...i, size: r, children: m }) });
 export {
-  a as SelectField
+  x as SelectField
 };

package/dist/components/Forms/Switch.js

@@ -4,7 +4,7 @@ import "react";
 import { Field as h } from "./Field.js";
 import { Label as n } from "./Label.js";
 import { Input as f } from "./Input.js";
-import "../RootProvider/RootProvider.js";
+import "../../Section-xbt3ft20.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";

package/dist/components/Forms/SwitchOptions.js

@@ -2,7 +2,7 @@ import { jsx as m } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import { Switch as e } from "./Switch.js";
-import "../RootProvider/RootProvider.js";
+import "../../Section-xbt3ft20.js";
 import { OptionsBase as n } from "./OptionsBase.js";
 import "../Button/Button.js";
 import "react-dom";

package/dist/components/Forms/TextField.js

@@ -2,12 +2,11 @@ import { jsx as r } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import { Input as e } from "./Input.js";
-import { FieldBase as n } from "./FieldBase.js";
-import "../RootProvider/RootProvider.js";
+import { F as n } from "../../Section-xbt3ft20.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";
-const h = ({ size: o, color: t, label: i, helperText: m, ...p }) => /* @__PURE__ */ r(n, { size: o, color: t, label: i, helperText: m, children: /* @__PURE__ */ r(e, { ...p }) });
+const u = ({ size: o, color: t, label: i, helperText: m, ...p }) => /* @__PURE__ */ r(n, { size: o, color: t, label: i, helperText: m, children: /* @__PURE__ */ r(e, { ...p }) });
 export {
-  h as TextField
+  u as TextField
 };